반응형

프론트엔드 기초/HTML 9

9.웹페이지의 레이아웃을 구성하기 위해 공간을 분할하는 태그

GitHub - junsu1220/TIL: Today I Learned. Today I Learned. Contribute to junsu1220/TIL development by creating an account on GitHub. github.com 웹페이지의 레이아웃을 구성하기 위해서 공간을 분할할 필요가 있다. 공간을 분할할 수 있는 태그는 div,span,table등이 있는데, 과거에는 table 태그를 사용하여 레이아웃을 구성하기도 하였으나 모던 웹에서는 주로div`를 사용하여 레이아웃을 구성한다. 그런데 div태그는 의미론적으로 어떠한 의미도 가지고 있지 않기 때문에 아래와 같이 HTML5에서 새롭게 추가된 시맨틱 태그를 사용하는 것이 더 나은 방법이나 IE에서 작동하지 않기 때문에 주의가..

8.사용자와의 커뮤니케이션을 위한 폼 태그

GitHub - junsu1220/TIL: Today I Learned. Today I Learned. Contribute to junsu1220/TIL development by creating an account on GitHub. github.com 1. form form 태그는 사용자가 입력한 데이터를 수집하기 위해 사용되며 input, textarea, button, select, checkbox, radio button , submitbutton 등의 입력양식태그를 포함할 수 있다. ... form elements (input, checkbox, radio button, submit button...) ... attributeValueDescription action URL 입력 데이터(for..

7.이미지의 표현과 동영상, 음악 들 멀티미디어를 지원하는 태그

GitHub - junsu1220/TIL: Today I Learned. Today I Learned. Contribute to junsu1220/TIL development by creating an account on GitHub. github.com 1. 이미지 웹페이지에 이미지를 삽입하는 경우, img tag를 사용한다. attributeDescription src 이미지 파일 경로 alt 이미지 파일이 없을 경우 표시되는 문장 width 이미지의 너비 (CSS에서 지정하는 것이 일반적) height 이미지의 높이 (CSS에서 지정하는 것이 일반적) 2. 미디어 2.1 audio audio 태그는 HTML5에서 새롭게 추가된 태그이다. IE8이하에서는 사용할 수 없다. |attribute |Des..

6.목록(List)와 표(Table)형식 표현을 위한 태그

https://github.com/junsu1220/TIL/blob/main/HTML5/%EB%AA%A9%EB%A1%9D(List)%EC%99%80%20%ED%91%9C(Table)%ED%98%95%EC%8B%9D%20%ED%91%9C%ED%98%84%EC%9D%84%20%EC%9C%84%ED%95%9C%20%ED%83%9C%EA%B7%B8.md GitHub - junsu1220/TIL: Today I Learned. Today I Learned. Contribute to junsu1220/TIL development by creating an account on GitHub. github.com 1. 목록(List) 1.1 순서없는 목록(Unordered List) 순서없는 목록 (Unordered L..

5.HTML의 핵심 개념인 Hyperlink

GitHub - junsu1220/TIL: Today I Learned. Today I Learned. Contribute to junsu1220/TIL development by creating an account on GitHub. github.com HyperText의 Hyper는 컴퓨터 용어로서 텍스트 등의 정보가 동일 선상에 있는 것이 아니라 다중으로 연결되어 있는 상태를 의미한다. 이것은 HTML의 가장 중요한 특징인 link의 개념과 연결되는데 기존 문서나 텍스트의 선형성, 고정성의 제약에서 벗어나 사용자가 원하는 순서대로 원하는 정보를 취득할 수 있는 기능을 제공한다. 한 텍스트에서 다른 텍스트로 건너뛰어 읽을 수 있는 이 기능을 하이퍼링크(hyperlink)라 한다. HTML link는 ..

4.텍스트 관련 태그

GitHub - junsu1220/TIL: Today I Learned. Today I Learned. Contribute to junsu1220/TIL development by creating an account on GitHub. github.com 최근의 웹 트랜드는 텍스트를 줄이고 이미지나 동영상 등으로 콘텐츠를 구성하는 것이지만 HTML 콘텐츠의 대부분은 텍스트로 구성된다. 제목이나 본문, 글자의 형태와 중요도를 나타내는 텍스트에 관련된 태그들을 알아보도록 하자. 1. 제목(Headings)태그 Heading 태그는 제목을 나타낼 때 사용하며 h1에서 h6까지의 태그가 있다. h1이 가장 중요한 제목을 의미하며 글자의 크기도 가장 크다. 시맨틱 웹의 의미를 살려서 제목 이외에는 사용하지 않는 ..

3.웹페이지를 구성하는 기본 태그

GitHub - junsu1220/TIL: Today I Learned. Today I Learned. Contribute to junsu1220/TIL development by creating an account on GitHub. github.com 1. 문서 형식 정의 tag 문서 형식 정의(Document Type Definition, DTD)태그는 출력할 웹 페이지의 형식을 브라우저에게 전달한다. 문서의 최상위에 위치해야 하며 대소문자를 구별하지 않는다. 문서별 기술 양식은 아래와 같다. HTML5 HTML 4.01 http://www.w3.org/TR/html4/loose.dtd"> XHTML 1.0 http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional..

2.시맨틱 요소와 검색엔진

GitHub - junsu1220/TIL: Today I Learned. Today I Learned. Contribute to junsu1220/TIL development by creating an account on GitHub. github.com 시맨틱 웹(Semantic Web) 2018년 전세계적으로 웹사이트는 19억개, 인터넷 사용자 수는 40억명이다. 대부분의 인터넷 사용자는 원하는 정보를 취득하기 위해 Google이나 Naver와 같은 검색사이트를 이용한다. “나는 검색된다. 고로 존재한다”는 말이 있을 정도로 웹사이트는 검색엔진에의 노출이 매우 중요하다. 당연한 것이 검색엔진에 노출되지 않는 웹사이트에는 접속하는 이도 없기 때문이다. 검색엔진은 이 시대의 가장 강력한 권력 중의 하나라..

1.HTML5 기본문법

GitHub - junsu1220/TIL: Today I Learned. Today I Learned. Contribute to junsu1220/TIL development by creating an account on GitHub. github.com 1. HTML5 HTML(Hypertext markup language)은 웹페이지를 기술하기 위한 마크업 언어이다. 조금 더 자세히 말하면 웹페이지의 내용(content)와 구조(structure)을 담당하는 언어로써 HTML 태그를 통해 정보를 구조화하는 것이다. HTML5는 2014년 10월 28일 확정된 차세대 웹 표준으로 아래와 같은 기능들이 추가되었다. 멀티미디어 - 플래시와 같은 플러그인의 도움없이 비디오 및 오디오 기능을 자체적으로 지원한..

반응형