CSS?
Cascading Style Sheets의 약자
마크업 언어(HTML/XHTML)가 실제 화면에 표시되는 방법(디자인)을 기술하는 언어로
HTML문서의 레이아웃과 스타일을 정의한다.
- 파일형식은 '*.css'로 저장.
CSS 기본 구조
Selector선택자 { Property 특성 : Value 값; }사용(선언)방법
• 외부 : CSS style 내용을 CSS 파일로 따로 저장하여 페이지에 연결시키는 방법.
여러 개의 파일을 연결시킬 수 있기 때문에 공통/자주 사용되는 부분을 따로 저장하여 사용하는게 용이.
<head> 안에 <link>로 작성.
<link rel="stylesheet" href="common.css">
• 내부 : <head> 안에 <style>로 선언.
• 직접 : 각 html 태그에 직접 style 속성 값으로 지정.
CSS의 상속
지정된 요소뿐만 아니라 자식, 자손 요소에게까지 적용되는 성격.
• 폰트 관련 속성은 상속된다.
• 배경색이나 배경 이미지 등의 속성은 상속되지 않는다.
• 박스 모델 관련 속성은 상속되지 않는다.
적용 우선 순위
• 다른 종류의 선언문인 경우 : in-line > 내부 선언 > 외부 선언의 순서로 우선 순위를 가짐.
• 같은 선택자의 선언문인 경우 : 스타일 선언이 위에서 아래로 순차적으로 적용이 되고, 마지막에 선언된 스타일이 우선 순위 가짐.
• 다른 선택자의 중복 적용시 : !important > inline > id(5) > class(3) > type(1) 의 순서로 우선 순위를 가짐.
'CSS' 카테고리의 다른 글
| [CSS] 가로 세로 영역 제어 width, height (0) | 2022.10.12 |
|---|---|
| [CSS] 가상선택자 :(pseudo-class), ::(pseudo-element) (0) | 2022.10.11 |
| [CSS] font와 text의 여러 특성들 (0) | 2022.10.05 |
| [CSS] 기본 선택자 종류 및 우선 순위 (0) | 2022.10.05 |
| [CSS] color / background-color (0) | 2022.10.04 |