CSS 파일을 만들어 html파일에 적용 시켜 보기
CSS 파일 없이
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="고양이가 좋아하는 것과 일상을 소개합니다."> <title>고양이의 일상</title> <style> h1 { color: #f00; } p { font-size: 18px; } </style> </head> <body> <h1>고양이의 하루</h1> <p>계속 잠을 잡니다.</p> </body> </html>
head 태그 안에 style 태그로 작성
CSS 파일 적용
CSS파일
.css 파일로 만들어야함
@charset "UTF-8"; body { background-color: rgb(206, 201, 155); } h1 { color: #0bd; } p { font-size: 20px; }
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> <link rel="stylesheet" href="ex03.css"> </head> <body> <h1>고양이의 하루</h1> <p>계속 잠을 잡니다.</p> </body> </html>
head 태그 안에
<link rel="stylesheet" href="ex03.css">
를 추가하면 CSS파일을 읽어들인다.
Share article