태그의 속성

황태규·2023년 6월 11일
0

HTML

목록 보기
4/5

태그는, 태그 내부에 값을 넣을 수 있을 뿐만 아니라, 태그마다 속성을 부여할 수 있습니다.

태그의 속성은 <태그 속성="값"> 의 형태로 사용하며, 태그마다 여러 속성을 부여 할 수도 있습니다.

HTML에서는 태그의 속성 또한 미리 정의되어 있으며, 태그 속성에 맞는 값을 입력하면 특별한 기능을 하게 됩니다.
예시

<html>
<head>
	<link type="text/css" href="my_style.css">
</head>
<body>
	<font color="red" face="Dotum">Hello</font>
	<font color="yellow">World</font>
</body>
</html>

link 태그 - type, href 속성을 통해 종류와 파일 위치 정의
font 태그 - color - 색상 face - 글꼴 정의

id, class 속성

모든 태그에는 id 속성과 class 속성을 지정해 줄 수 있는데, 이를 이용하면 CSS나 JavaScript에서 태그를 좀더 쉽게 다룰 수 있습니다.
id는 원칙상 하나의 id당 하나의 태그에만 적용 할 수 있으며, class는 하나의 class를 여러 태그에 적용 할 수 있습니다.

예시

<div id="my-box1"></div>
<div id="my-box2" class="boxes"></div>
<div id="my-box3" class="boxes"></div>
<div class="boxes"></div>

style 속성

style 속성은 태그의 스타일, 즉 보이는 형태를 정의하는 속성입니다.

HTML 자체의 기능이라기 보다는 CSS의 속성들을 HTML 문서 내에서 태그에 직접 설정할 때 쓰이는 속성입니다.
이와 관련해서 자세한 설명은 CSS를 봐주시기 바랍니다.

예시

<div style="width:500px; height:300px"></div>
<div style="height:40px; border: 1px solid green">mybox</div>
profile
응애

0개의 댓글