[TIL] <body> 안의 HTML 태그-1

이지예·2022년 4월 22일
0

HTML

목록 보기
2/9

제목(Heading) 태그 < h >

문서 내의 제목을 표현할 때 쓰는 태그로, 제목의 레벨에 따라서 h1부터 h6태그까지 존재하고 숫자가 낮을수록 큰단위의 제목으로 사용되기 때문에 h1태그는 해당 페이지를 대표하는 제목으로 사용되는 경우가 많다.

단락 태그 < p >

단락을 나타내는 태그로, 긴 글에서 단락을 나눠주면 단락별로 개행이 된다.

개행태그 < br >

개행을 해주는 태그로, 단락 내에서 강제로 개행을 할 때 이용한다.
닫기 태그와 내용이 존재하지 않는 빈 태그이다.

텍스트를 꾸며주는 태그

< b > : bold 태그. 긁자를 굵게 표현 해준다.
< i > : 글자를 기울여서 표현해준다.
< u > : 글자에 밑 줄을 그어준다.
< s > : 글자의 중간선을 그어준다.

시멘틱 마크업

기계가 잘 이해할 수 있도록 하는 언어.

< strong > : 중요한 글자를 나타내는 태그. 글자를 굵게 하라는 의미가 아니지만, 브라우저가 태그의 의미를 생각해서 기본 스타일을 굵게 표현한다. < b >와 같은 모습이다.

< em > : 글자의 특정 부분을 강조하는 의미를 가진 태그이다. 브라우저에서는 < i >와 같은 모양이다.

< ins > : 새롭게 추가된 요소라는 의미를 가진 태그. < u >태그와 같이 밑줄로 보인다.

< del > : 삭제된 요소라는 의미를 가진 태그. 브라우저에서 < s >태그처럼 보인다.


앵커태그 (링크태그) < a >

링크를 생성하는 태그로 HTML의 가장 큰 특징이 되는 태그이다.
링크를 만들기 위해서 앵커는 반드시 href(하이퍼 레퍼런스) 속성을 가지고 있어야 한다. 이 속성의 값에는 링크의 목적지가 되는 URL이 들어가게 된다. 앵커태그 사이에 내용을 입력하면 브라우저에서 입력된 내용이 출력되고 속성값으로 넣은 URL이 하이퍼링크로 걸려있는 것을 볼 수 있다.

target 속성

_self : 별도로 선언하지 않으면 target을 self로 선언한 것과 동일한 방식으로 동작. 보고있던 하이퍼링크가 걸린 내용이 나온 브라우저 창이 외부 링크 페이지로 이동하는것이 self이다.

_blank:새로운 창, 빈 창에 외부 페이지가 나타난다.

내부링크

앵커태그는 외부 페이지 뿐만 아니라 페이지 내부의 특정 요소로 초점을 이동시킬 수도 있다. #(해시기호)를 쓰고 이 뒤에 이동시키고자 하는 요소의 id속성값을 넣어주면 된다. 페이지가 길어서 스크롤이 한참 내려간 뒤 다시 화면 맨 위로 올라가고자 할 대 쓰이며 책갈피 기능이라고도 한다. id속성과 #의 순서는 상관없이, #에 적힌 id속성의 위치로 이동한다.

0개의 댓글