whatisthis?
CSS 이론 - SYNTAX / How to use? 본문
CSS
= Cascading Style Sheet
스타일을 분리해서 관리하기 위한 것.
- Document + Style
스타일 없이 html로만 웹페이지를 만든다면?
- 정보를 주기 위한 HTML의 본질을 잃게 됨
- 웹사이트의 스타일을 일관적으로 적용
- 유지보수도 용이함
CSS SYNTAX
1) 선택자 selector
스타일을 적용할 대상 지목.
전체/클래스/아이디/요소 선택자 등 다양한 선택자가 있다.
2) 선언부
property : value; 의 형태로 이루어짐.
(속성과 속성값)
세미콜론(;)은 한 문장이 끝날때마다 꼭 써줘야함.
문장의 종결을 알리는 콤마와 같은 역할.
How to use CSS?
1. link:css 이용
- emmet 기능으로 link:css라고 입력하면 다음과 같이 코드가 나옴.
- html 문서의 <head>내에 입력해줘야 함.
<link rel="stylesheet" href="style.css">
REL = relation , 즉 연결 관계
HREF = hypertext reference
cf. SRC = source
- 가장 권장되는 방법임.
2. <style>태그 이용
-html 문서 head 내에 <style>태그 안에 작성하기.
3. inline-style 적용
요소(element)에 직접 속성으로 스타일을 적용.
예> <p style="color: red"> 내용 </p>
- 가장 유지보수도 어렵고 좋지 않은 방식임.
- 아주 특별한 몇가지 방법 제외하고는 절대 쓰지 말기.
'WEB STUDY > HTML,CSS' 카테고리의 다른 글
CSS part 1 - (2) Box Sizing (0) | 2021.12.07 |
---|---|
CSS part 1 - (1) 박스 모델(Box Model) (0) | 2021.12.07 |
HTML 훈련 - (14) Video Player (0) | 2021.11.10 |
HTML 훈련 - (13) Music Player (0) | 2021.11.10 |
HTML 훈련 - (12) Gmail Inbox (0) | 2021.11.10 |