CSS 소개
CSS : Cascade Style Sheet
1. 우리가 CSS를 사용하는 이유?
- 웹사이트를 내가 원하는대로 꾸밀 수 있다.
- HTML을 HTML답게 사용할 수 있다.
2. [CSS Zen Garden] 둘러보기
같은 html 파일을 CSS로 다양하게 디자인한 예시들
3. 정보 요소와 시각 요소의 분리
설계는 HTML로 & 디자인은 CSS로
CSS 코드 사용하기
<span>이 부분</span>을 두껍고 파랗게!사용법 1. 요소에 직접 적용하기
<span style="font-weight: bold; color: blue;">이 부분</span>을 두껍고 파랗게!=> 같은 스타일을 적용하는 경우가 많기 때문에 비효율적, 잘 안 씀
사용법 2. head 태그 내 style 태그에 적용
<head>
<!-- 중략 -->
<style>
span {
font-weight: bold;
color: blue;
}
</style>
</head>
<body>
<span>이 부분</span>을 두껍고 파랗게!
</body>=> 스판 태그를 사용할 때마다 스타일이 적용됨
=> 그러나 한 페이지 내에서만 가능하다는 한계점이 있음
=> 규모가 큰 사이트에서는 사용하지 않는 방법
사용법 3. 별도의 CSS 파일에 분리
<head>
<!-- 중략 -->
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
<span>이 부분</span>을 두껍고 파랗게!
</body>span {
font-weight: bold;
color: blue;
}참고 툴
안녕하세요 이동주입니다