[실습] CSS 종류
인라인 스타일
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSS 종류</title>
</head>
<body>
<h4>인라인 스타일</h4>
<p style="color: red;">HTML 태그에 직접 스타일을 적용하는 인라인 스타일</p>
<p style="color: blue;"><HTML 태그 style="속성:값;">으로 정의</p>
</body>
</html>
내부 스타일
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSS 종류</title>
<style>
#p1 {
color : green;
}
.p2 {
color: orange;
}
</style>
</head>
<body>
<h4>내부 스타일</h4>
<p id="p1">내부 스타일</p>
<p class="p2"><head>태그 속 <style>태그로 정의</p>
</body>
</html>
외부 스타일
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSS 종류</title>
<link rel="stylesheet" href="example.css">
</style>
</head>
<body>
<h3>외부 스타일</h3>
<p><head>태그 속 <link>태그로 링크 // 별도의 .css파일에 스타일을 정의한다 </p>
</body>
</html>
/* example.css 파일 */
h3 {
background-color: yellow;
}
