11. 15 HTML 정리

황희윤·2021년 11월 15일
0

HTML

  • HTML은 웹 페이지를 만드는 언어로, 웹 페이지의 구조를 만든다.

  • HTML 파일은 이미지, 텍스트, 비디오, 버튼 등 웹사이트에 보여줄 내용을 구성한다.

  • element(요소) : 하나의 <태그이름>으로 시작하여 하나의 </태그이름>으로 끝나는 구조

HTML 태그

  • '<!DOCTYPE>' : html파일이 무슨 버전의 html을 사용했는지 브라우저에 알려주는 역할로 HTML5를 의마한다.
    html 태그는 아니지만 html 파일 첫 줄에 위치하는 선언문이다.

  • 헤드(head): 사이트의 제목, 설명, 부가정보, 기술적 내용(ex. 이 사이트는 주로 모바일용인지)이 들어가는 부분

  • <'meta name="viewport" content="width=device-width">: 디바이스의 가로 크기가 웹 페이지의 가로와 같다는 의미로, 모바일에서도 웹사이트가 잘 보이려면 필요한 태그다. 만약 이 태그가 없다면, 데스크탑 버전의 웹페이지가 축소되어 보일 수 있다.

  • <span 태그> : 주로 텍스트를 내용으로 갖는데, inline-element로 한 줄로 이어서 출력된다.
    span 태그는 내용인 텍스트만큼만 영역을 차지하고 있다.

  • : span 태그처럼 주로 텍스를 내용으로 갖는데, span과 달리 inline-element가 아니라서 **줄바꿈**이 가능하다.

span과 p 태그 코드 비교

<span></span>
<span>희윤</span>
"황희윤"으로 한줄로 이어서 출력됨

<p></p>
<p>희윤</p>
황
희윤
으로 위에 처럼 줄바꿈이 되어서 출력됨
  • <div태그> : division의 줄임말로 섹션을 나눌 때 사용된다.
    비슷한 것끼리 그룹을 만든다,
    디자인에 맞게 레이아웃을 분리한다,
    div 태그안에 id나 class와 같은 속성을 부여해서 css 스타일로 만들 수 있다.

HTML 속성(attribute)

  • id : 각 태그에 고유한 이름을 준다
    id는 절대 다른 요소와 중복될 수 없다.
    id는 해당 요소에 특별한 기능이나 디자인을 넣고 싶을 때 사용한다.
  • class : id와 달리 중복이 가능한 속성으로, 다른 요소들과 함께 동일한 class를 가질 수 있다.
profile
HeeYun's programming study

0개의 댓글