본문 바로가기

전체 글229

HTML5 엘리먼트 알아보기 (계속업데이트) HTML5 HTML5 엘리먼트 알아보기 (계속업데이트) 업데이트로 올린글 링크 section 엘리먼트 HTML5 aside 엘리먼트 HTML5 article 엘리먼트 HTML5 nav 엘리먼트 HTML5 section 엘리먼트 HTML5 article 엘리먼트 HTML5 aside 엘리먼트 HTML5 hgroup 엘리먼트 HTML5 header 엘리먼트 HTML5 footer 엘리먼트 HTML5 address 엘리먼트 group 엘리먼트 HTML5 p 엘리먼트 HTML5 hr 엘리먼트 HTML5 pre 엘리먼트 HTML5 ol 엘리먼트 HTML5 ul 엘리먼트 HTML5 li 엘리먼트 HTML5 dl, dt, dd 엘리먼트(element) HTML5 figure, figcaption 엘리먼트(element) HTM.. 2010. 7. 22.
HTML5 menu,command 엘리먼트(element) HTML5 menu, command 엘리먼트(element) 커맨드리트를 표현하는 menu엘리먼트 상세히 표현하기위해 command엘리먼트가 자식엘리먼트로 html5에서 추가되었다. 커맨드엘리먼트는텍스등으 여러가지로 나타난다.커맨드는 현재 아직지원하지않는다. 냉무 역시차후 업데이트 2010. 7. 22.
HTML5 details, summary 엘리먼트(element) HTML5 details 엘리먼트(element) 스크립트와 더불어 흔히 웹사이트에서 클릭시 화면에 새로운정보를보여주고 클릭시 사라지는경우를 봤을 것이다. 이를 구현해주는것이 이엘리먼트이다. 클릭할것은 삼각형버튼으로 되어있다. 하지만 아직 브라우저에서 지원하지 않는다.summary는 details의 자식엘리먼트로 요약해서 설명해준다. 어쩌고저쩌고 울라불라울라불라.... open속성 엘리먼트는 보이는 상태로 시작된다 2010. 7. 22.
HTML5 canvas 엘리먼트(element) HTML5 canvas 엘리먼트(element) canvas엘리먼트는동적그래픽을 구현한다. 단독으로 이 엘리먼트만으로 구현 되지 않는다. 스크립트를 동반해서 사용하여 구현하다.속성엘리먼트로는 가로세로를 지원한다. 간단한 예 자바스크립트에서는 아이디로 접근,그리고 getContext로 시작한다. 이예대한 예는 차후에 .... 2010. 7. 22.
HTML5 audio, source 엘리먼트(element) HTML5 audio, source 엘리먼트(element) audio 엘리먼트가 사운드나 오디오 스티림을 제공하는 것은 잘알려진 것이고 video엘리먼트와 차이점은 사운드제공이니 속성엘리먼트 가로,세로, poster(첫화면 엘리먼트) 이것이 없다는 점이다. source source는 비디오, 오디오 엘리먼트의 자식엘리먼트이다. 비디오 오디오 엘리먼트의 경우 src 속성에 지정하다보니 하나밖에 지정할 수 밖에없다. source는 자식엘리먼트로 다수의 미디어소스를 지정하게한다. 하지만 본목적은 이들이 순차적이거나,선택적인것은 아니란접이다. 여러개를 스는이유는 적합한 경우(즉 브라우저나,코덱지원등에 따라)에 따라 지정된 것을 재생해주도록한다. 2010. 7. 21.
HTML5 video 엘리먼트(element) HTML5 video 엘리먼트(element) 가장주목받는 엘리먼트 중 하나인 비디오(video)를 살펴보자. 오디오기능도 지원하며 가장 좋은점이라면 별도의 플러그인 없이 재생이 가능하다는 점일 것이다. 새로생긴것이니 간단한예부터 보자 autoplay : 말그대로 자동플레이. 웹페이지에 들어가서 자동플레이하게된다 controls : 컨틑롤러 플레이, 멈춤 , 볼륨등의 인터페이스를 제공하게된다 loop : 루프 이값을 주면 무한반복 재생 height, width : 절절한 가로 세로 크기 입력 poster : 동영상이 재생되기전 까지 주소에 지정된 그림을 보여준다. src : 비디오 파일의 주소 : 현재까지 지원되는 형식은 Ogg, MP4 적절한 동영상을 구하지못해 실행시 그림만 올린다. 마지막으로 비디오.. 2010. 7. 20.
HTML5 input 엘리먼트와 새로운 type HTML5 input 엘리먼트와 새로운 type html5에서 많은 타입이생겼다 기존에 있던것은 생략하고 새로생긴것을 살펴보자. 명확성이 강조 되었다고 보면 된다.오페라 프라우저에서 대부분 지원한다. 결과를 당장보려면 여기로 http://sianasiatiger.cafe24.com/study/5_html_input.html 찾아보기: 천화번호: 주소: 이메일: 위의것은 간단한예 대부분우리가 기존에 입력하던 텍스트 타입이 명확하게 분류되었다.search는 찾아볼떄 tel은 전화번호 입력으로 특정한 입력 방식은 없지만 placeholder로 입력값 힌트를 준다. 위의 예는 xx)xxx-xxxx방식으로 입력하라고 예를들어주고있다.url은 경로주소 입력 email은 이메일로 multiple입력으로 콤마로 여러개.. 2010. 7. 15.
HTML5 meter 엘리먼트(element) HTML5 meter 엘리먼트(element) 현재의 상태가어느정도인지보여줄때 사용한다. 아래의 3개의 예는 같은뜻을 다른 방법으로 표현한 것이다. 6/8 75/100 1. 첫번째는 그림으로 철도를 보여주고 value로 현재상태를나타 내었다. 2. 두번째는 최대값을 8으로 잡아주고 value로 현재상태를나타 내었다. 3. 세번째는 최대(max) 최소값(min)을 잡아주고 value로 현재상태를나타 내었다. 2010. 7. 14.
HTML5 progress 엘리먼트(element) HTML5 progress 엘리먼트(element) progress 엘리먼트는 작업,수행의 진척정도를나타낸다.플래시에서 흔히 100%로딩을 기다리듯이 html5에서 역시 그런것을 구현한것이다.텍스트는 초기값 max엘리먼트는 최대값을 나타낸다. 테스트결과 아직까지 지원브라우저는없었다. 작업처리 작업처리:0% 2010. 7. 14.