학습 내용
CSS 스타일 3가지: 제작자, 사용자, 브라우저
ex) 제작자: 직접 지정한 css / 브라우저: a태그 시에 자동으로 파란색 + underline 되는 것.
우선순위: 사용자(! important) > 제작자(! important) > 제작자 > 사용자 > 브라우저
코드
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<!-- internal style -->
<style>
.green--text {
color: green;
}
.text-decoration-none {
text-decoration: none;
}
#dark {
background-color: black;
color: white;
}
.yellow {
color: yellow;
}
</style>
<link rel="stylesheet" href="main.css" />
</head>
<body>
<!-- inline style -->
<h1 style="color: blue">제목</h1>
<p class="green--text">안제목</p>
<hr />
<a class="text-decoration-none" href="http://www.naver.com/">Naver</a>
<br />
<span>Test Document</span>
<ul id="exst">
<li>음</li>
<li>오</li>
<li>아</li>
<li>예</li>
</ul>
<hr />
<p id="dark">
<span class="yellow">오에</span> <br />
오예 <br />
오예 <br />
</p>
</body>
</html>
CSS
/* * {
color: skyblue !important;
} */
/* external style */
#exst {
padding: 30px;
background-color: black;
color: gray;
}