HTML 은 브라우저에 어떻게 구조적으로 렌더링 할 지 결정하는 태그이다.

반면에 지금 부터 배울 CSS 는 구조화 된 웹 문서 내용에 어떤 디자인의 옷을 입힐지 결정하는 언어이다.

또한 앞으로는 배울 javascript로 구조화된 웹 문서에 접근해서 처리하는 것을 배울 것이다.

HTML로 건물의 구조를 만들고, CSS로 건물의 내부를 예쁘게 꾸미고, 자바스크립트로 건물의 여러 동적인 요소 자동문, 엘리베이터 등등의 동적인 요소들을 구현한다고 일단 생각해 두자

지금 사용하는 CSS(Cascading Style Sheets) 는 CSS3로 2005년에 정의되었다. CSS3는 정적이어서, SASS가 등장 하였고, 기본 언어 처럼 동적인 요소가 가미 되었다.

HTML 에서 CSS 적용 방법

KakaoTalk_20230105_094106230.jpg

인라인 스타일 시트(Inline Style Sheet)

바디내에 직접 적용하는 방법이다.

다른 설정 방법과 중복되면,이 방법이 우선 한다.

<!DOCTYPE html>
<html>
	<body>
		<h1 **style="color:blue"**>Hello World!</h1>
	</body>
</html>

내부 스타일 시트(Internal Style Sheet )

<!DOCTYPE html>
<html>
	<head>
		**<style>
			h1 { /* 선택자 */
					color: blue;
			}
		</style>**
	</head>
	<body>
			<h1>Hello World</h1>
	</body>
</html>