okthatsimple

목적iframe : inline frame동영상, 지도, 다른 웹페이지를 가져오는 데 사용예시 ```

HTML Form목적웹사이트에 상호작용 기능을 넣을 떄 사용설문 조사, 사이트 검색 기능 등구성 tag : input, button, select, textarea, label, fieldset, legend, datalist, output예시 First Name Last Name input목적사용자 입력 받기type은 다음 중 하나를 입력할 수 있다.text, password, checkbox, radio, submit, button, file, number, date, email, color, range, hidden, image예시 Name button목적클릭예시 Click Heres..

HTML Lists목적HTML Lists : 정보를 순서대로 혹은 순서 없이 웹 페이지에 표시하는 방식순서 없는 리스트(ul), 순서 있는 리스트(ol), 리스트 항목(li)으로 표현dl, dt, dd 태그도 있음예시 Text A B C Number 1 2 3

table목적HTML Table은 표 형식의 행과 열에 들어있는 데이터 묶음이라 할 수 있음보통 table, th(제목, table header), tr(행, table row), td(데이터, table data) 정도를 쓴다.특정 열에만 CSS를 적용하는 경우(배경 색 등) colgroup을 쓴다.table 안에 CSS를 세분화하려는 경우 thead, tbody, tfoot을 쓸 수도 있다.예시셀 테두리 A B C 100 200 300 셀 병합 A B 100 ..

Tags대표적으로 p, a, div, span, break, script가 있다.p목적단락(paragraph)을 들여쓰기나 서식을 줄 떄 사용예시 Paragraph!a목적사이트 링크, 다운로드 링크 등 다른 페이지로 이동하는 하이퍼링크를 표현함목적지를 알려주는 href 속성과 함께 쓰임예시Googlediv목적HTML 문서의 섹션을 나누어, 섹션 전체에 CSS를 적용하거나 자바스크립트 인자로 사용 가능p와 div의 차이p는 중첩 안 됨. p 안에 p 안 됨.div 안에는 div, p 모두 담을 수 있음.예시 div!span목적span 자체는 아무런 변화도 안 줌span 태그에 CSS, javascript를 적용할 수 있음.p, div, span의 차이p와 div는 block-level eleme..

특수문자entity는 특수기호를 표시하는 방법을 지원html에서 왼쪽 꺾쇠(또한 일반적인 키보드에서 지원하지 않늩 기호들(£ 등)을 지원하는 entity name도 있음표현&entity_name; 또는 &#entity_number;예시< <는 모두 왼쪽 꺾쇠임예시스페이스  꺾쇠(<큰따옴표(", double quotation mark) "

HeadingHeadingh1~h6까지 있다.SEO(검색 엔진 최적화)에 장점이 있기 때문에 heading을 쓴다.LinksGoogleImagesclosing tag가 없다.Semanticssemantic이란 표현식에서 의미를 추론할 수 있음을 의미한다.예를 들어 폰트 사이즈 50인 제목과, 으로 작성된 제목이 있다고 하자.검색 엔진은 h1으로 작성한 제목에게 더 높은 점수를 부여하고, 검색 결과에 더 잘 반영시키게 된다.즉 같은 내용이라도 semantic tag를 쓸 떄 더 좋은 웹 페이지가 된다는 뜻이다.semantic element에는 , , , . , 등이 있다.

Attributes역할 : HTML element에 정보를 추가함. 모든 element는 attribute를 가질 수 있음.위치 : attribute 위치는 언제나 opening tag임.조건 : name="value" 형태로 작성.대표적으로 아래 attribute가 있음.id고유 id를 element에 지정함.styling, 자바스크립트 함수 인자로 사용class여러 클래스를 지정 가능.styling, CSS 적용 시 사용src이미지, 음악, 동영상 등 자료의 URL을 설정href연결된 자료의 URL을 명시, 보통 하이퍼링크에 사용.이 외에도 많은 태그들이 있다.width="300px"height="100px"title="Hello"style="font-size:20px"id, class 예시 B..

Element, TagHello! : Opening Tag라고 부른다.Opening Tag, Closing Tag 사이는 Content라고 부른다. : Closing TagElement : Opening Tag + Content + Closing TagEmpty Element아무 출력도 없는 element: 새로운 줄(개행) 태그

Hello!