Santos의 개발블로그

* HTML5요소(3)에서 다루지 못한 내용을 계속해서 다룹니다. HTML5요소(3)이 궁금하시다면 여기를 클릭해주세요. 가. select 요소 드롭다운 리스트를 만들 때 사용하는 것으로, 리스트에서 선택할 수 있는 옵션을 정의하기 위해서 select의 속성과 하위요소로서 option 요소를 사용한다. Select Tutorial: WikitechyHTML WikitechyCSS WikitechyPHP 1) select 요소의 속성 2) option 요소의 속성 - option 요소는 선택 목록에서 옵션을 정의하기 위해 select 요소와 datalist 요소의 하위 요소로만 사용된다. - select 요소 내에는 optgroup 요소도 함께 사용될 수 있는데, 이는 드롭다운 리스트에서 연관된 항목들을 ..

#1 웹 폼 로그인, 회원 가입, 주문 정보 등을 처리하기 위해서는 사용자로부터 필요한 데이터를 입력받아야 하는데, form 요소 안에 input, textarea, select, button, fieldset, label 등의 다양한 요소들을 통틀어 웹 폼이라 한다. 가. form 요소 First Name: Second Name: 1) form 요소의 속성 2) method 속성의 전송 방식의 비교 나. input 요소 form 요소 중에서 사용 빈도가 가장 높고 사용자가 데이터를 입력할 수 있도록 다양한 입력 타입을 제공한다. 1) type 속성 2) input 요소의 속성 다. textarea 요소 사용자로부터 여러 줄에 해당하는 텍스트를 입력받기 위해서 사용하는 요소 Wikitechy A Lear..

#1 시멘틱 블록 요소 가. main 요소 Wikitechy Tutorials Wikitechy provide HTML, CSS tutorials for beginners HTML Tutorial HTML-Hyper Text Markup Language. It is used to create a static web page. CSS Tutorial CSS-Cascading Style Sheets Specification is a computer language that is used to write formatting instructions (rules). - main 요소는 문서 body 영역의 주요 콘텐츠 블록을 지정할 때 사용한다. main 요소 안의 콘텐츠 블록은 문서에서 유일한 부분이므로 문서에..

#1 레이아웃 시멘틱 요소 - 이전 HTML에서는 검색 엔진이나 자동으로 문서를 해석하는 프로그램을 이용해서 문서를 판별하고 해석하기는 힘든 문서 구조를 갖고 있었다. 이는 문서의 구조나 요소 내용에 대한 의미를 명확히 전달하려는 목적보다는 문서를 어떻게 표현할 것인가에 중점을 두었기 때문이다. - 그림과 같이 웹 문서를 작성하면 각 영역을 나타내려는 id 속성의 값이 문서 작성자마다 달라질 수 있으므로 속성값으로 문서의 구조를 자동으로 판별하고 해석하는 것이 쉽지 않고, 복잡한 페이지의 경우에는 많은 div 요소가 중첩되어 문서 구조 파악을 더욱 어렵게 만든다. - HTML5에서는 표현중심이 아닌 의미있는 구조문서 작성을 위해 다양한 시멘틱이 추가되었다. - 요소명 자체만으로도 그 요소가 어떤 문서 구..