1. div (Division)
tag |
의미 및 특징 |
div |
요소들을 그룹으로 정의하는 태그 (블록 레벨 요소) |
CSS 적용을 쉽게하기 위해 그룹 설정 (웹사이트의 레이아웃을 만들 때 주로 사용 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>div 그룹 요소</title>
<style>
#wrap{width: 300px; margin: 0 auto; border: 1px solid #000; text-align: center;}
/* header{width: 300px; margin: 0 auto; border: 1px solid #000; text-align: center}*/
/* section{width: 300px; margin: 0 auto; border: 1px solid #333; text-align: center}*/
/* footer{width: 300px; margin: 0 auto; border: 1px solid #999; text-align: center}*/
</style>
</head>
<body>
<div id="wrap">
<header>헤더</header>
<section>본문</section>
<footer>푸터</footer>
</div>
</body>
</html>
div 그룹 요소
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>span 그룹 요소</title>
<style>
.s1{font-size: 20px; font-weight: bold; background-color: yellow;}
.s2{border: 4px dotted skyblue; color: blue;}
.s3{font-style: italic; color: red}
</style>
</head>
<body>
<span class="s1">span 태그</span>
<span class="s2">span 태그는</span>각 글자단위로
<span class="s3">적용하기가</span> 편리합니다.
</body>
</html>
span 그룹 요소
span 태그
span 태그는각 글자단위로
적용하기가 편리합니다.
댓글