본문 바로가기

반응형

웹프로그래밍

(125)
CSS 동위선택자, 상태선택자 1. 동위선택자 선택자 형태 설명 선택자A + 선택자B 선택자A 바로 뒤에 위치하는 선택자B 선택 선택자A ~ 선택자B 선택자A뒤에 위치하는 선택자B 선택 header-1 header-2 header-3header-4 2. 상태선택자 : 입력양식의 상태를 선택할때 사용하는 선택자 선택자 형태 설명 :checked 체크상태의 input 태그 선택 :focus 초점이 맞추어진 input 태그 선택 :enabled 사용가능한 input 태그 선택 :disabled 사용 불가능한 input 태그 선택
CSS 속성선택자 1. 선택자[속성] , 선택자[속성=값] - 특정한 속성이 있는 태그 선택 img[alt] img 중에 alt 속성을 가진 것만 찾는다. input[type=password] input 중에 type이 password 인 것만 찾는다. div#header 아이디가 header 인 div 선택하는 같은 방법이다. div[id=header] div[id="header"] 2. 선택자[속성~=값] , 선택자[속성|=값] - 속성 안의 값이 특정 값을 단어로 포함하는 문서 객체를 선택(띄어쓰기 포함) img[alt~="test"] test 뒤에 띄어쓰기가 있는경우도 찾는다. test 앞에 띄어쓰기가 있는경우도 찾는다. img[alt|="test"] test 뒤에 - 있는 경우 찾는다. 3. 선택자[속성^=값] ..
HTML5 비디오태그 <video></video> 비디오 태그는 웹페이지에서 동영상을 볼 수 있게 만들어주는 기능을 수행한다. 원래 HTML5 시대가 오기 전에는 비디오도 윈도 미디어 플레이어 또는 플래시와 같은 플러그인을 사용해서만 볼 수 있었다. 하지만 HTML5 시대가 오면서 웹표준만으로 동영상을 볼 수 있게 되었다. *유튜브는 플래시를 사용해서 동영상을 재생하게 설계되었지만 http://www.youtube.com/html5 에 들어가서 HTML5 기능을 실행하면 플래시 없이 동영상을 볼 수 있다. video 태그의 속성 속성 이름 값 설명 src URL 비디오파일의 경로지정 height 숫자 비디오의 높이를 지정 width 숫자 비디오의 너비를 지정 poster URL 비디오 준비중일 때의 이미지 파일 경로 지정 muted "muted", ""..
HTML5 오디오태그 <audio></audio> 오디오 태그는 웹브라우저에서 플러그인의 도움 없이 음악을 재생할 수 있게 만들어주는 HTML5 태그 이다. HTML5에서 추가된 기능이므로 IE8 이하에서는 사용할 수 없다. audio 태그의 속성 속성 이름 값 설명 src URL 음악파일의 경로지정 controls "controls", "" , - 음악 재생 도구를 출력할지 지정 autoplay "autoplay", "", - 음악을 자동 재생할지 지정 loop "loop", "", - 음악을 반복할지 지정 preload "none", "metadata", "auto" 음악을 재생하기 전에 모두 불러올지 지정 none : 사용자가 오디오를 필요로하지 않을 것이라고 명시, 미리 다운로드 하지 않음 metadata : 사용자가 오디오를 필요로 하지 않을 ..
Javascript 모바일 체크 var mobilecheck = function() { var check = false; (function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207|63..
Javascript Favicon 적용 (function() { var link = document.createElement('link'); link.type = 'image/x-icon'; link.rel = 'shortcut icon'; link.href = '/resources/pubtree/images/favicon.ico'; document.getElementsByTagName('head')[0].appendChild(link); }());
input type=text 에서 엔터 눌렀을때 submit 실행 1. onkeydown="javascript: if (event.keyCode == 13) {chkform();}" 이런식으로 체크한다. 함수 호출로 chkform(); view source print? 01.function chkform() 02.{ 03.var f = document.fo_search; 04.if(f.addr1.value == '') 05.{ 06. alert('지역을 선택해주세요.'); 07. f.addr1.focus(); 08. return false; 09.}else{ 10. document.fo_search.submit(); 11.} 12.} document.fo_search.submit(); 이런식으로 form의 submit 실행
How to Enable CSS3 Border Radius in Internet Explorer 8 and below CSS3 gives us the ability to create rounded corners with the border-radius property. But as you might already know, this new feature is not recognized in Internet Explorer 8 (IE8) and its earlier versions. So when you apply CSS3 Border Radius to an element, it still appears as a box with pointed tips. You may find a lot of different advice on the Internet suggesting you ignore IE8. You wish you ..

반응형