기타/HTML and CSS
[CSS] CSS 적용 방법
푸쿠이
2018. 6. 27. 11:49
css를 적용시키는 방법에는 총 3가지가 있다.
Inline style sheet
Internal style sheet
Linking style sheet
ㅇ Inline style sheet
html 태그 style 속성에 css 코드 삽입
<!DOCTYPE html>
<html>
<head>
<title>티스토리 테스트</title>
</head>
<body>
<p style="color: blue">Inline style sheet</p>
</body>
</html>
ㅇ Internal style sheet
html 문서 내 <style>~</style> 내에 css 코드 삽입
<!DOCTYPE html>
<html>
<head>
<style>
p {
color: blue;
}
</style>
<title>티스토리 테스트</title>
</head>
<body>
<p>Internal style sheet</p>
</body>
</html>
ㅇ Linking style sheet
별도의 css 파일을 만들고 html 문서와 연결
<!DOCTYPE html>
<html>
<head>
<!-- html 파일에 link 태그 추가해서 css 파일 연결 -->
<link rel="stylesheet" href="tistoryTest.css">
<title>티스토리 테스트</title>
</head>
<body>
<p>Linking style sheet</p>
</body>
</html>
/* tistoryTest.css 파일 */
p {
color: blue;
}
결과
Inline style sheet
Internal style sheet
Linking style sheet