[edwith] 초보 HTML&CSS 7강 - CSS를 HTML에서 사용하는 방법

HTML & CSS

펜네임 2019. 6. 3. 22:52

p {
	color : red;
}

1. 선택자(selector) : p

2. 속성(property) : color

3. 값(value) : red

- 스타일을 바꾸고 싶은 태그에 직접 적용

<p style="color:blue;">Hello world</p>

- html 안에 있는 head 태그 안에 스타일 태그를 만들어 적용

- 장점 : CSS파일을 별도로 관리하지 않아도 됨, 브라우저가 서버에 CSS파일을 요청하지 않아도 됨

<html>
<head>
    <style>
    	p {
        	color:blue;
        {
    </style>
</head>
<body>
	<p>Hello world</p>
</body>
</html>

- 가장 흔한 방법

- html파일과 별도로 css파일을 따로 만들어 두고 link 태그로 연결

<html>
<head>
	<link rel="stylesheet" type="text/css" href="main.css"/>
</head>
<body>
	<p>Hello world</p>
</body>
</html>

*메모 : 스타일 적용 시 우선순위는 inline > internal > external 순서.