Notice
Recent Posts
Recent Comments
Link
250x250
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- hash table
- 알고리즘
- HTML
- 자료구조
- JavaSceipt
- java
- 프로그래머스
- 자료형
- 컴포넌트
- computed
- Algorithm
- string
- 코딩테스트
- scss
- array
- leetcode
- vue.js
- 파이썬
- github
- SasS
- CSS
- dynamic programming
- math
- 변수
- greedy
- sorting
- Python
- 백준
- JS
- JavaScript
Archives
- Today
- Total
Posis
[CSS] 선택자와 우선순위 본문
class 선택자
- 요소의 특정 부분에만 스타일 적용
- 마침표(.) 다음에 클래스 이름 지정
- 문서 안에서 여러 번 반복해서 사용할 수 있음, 중복 가능
id 선택자
- 요소의 특정 부분에만 스타일 적용
- 파운드(#) 다음에 id 이름 지정
- 문서 안에서 한번만 사용할 수 있음, 중복 불가
스타일 충동을 막는(Cascading)의 원칙
- 스타일 우선순위: 스타일 규칙의 중요도와 적용 범위에 따라 우선순위가 결정되고 그 우선순위에 따라 위에서 아래로 스타일 적용
- 스타일 상속: 태그들의 포함 관계에 따라 부모 요소의 스타일을 자식 요소로, 위에서 아래로 전달
Style 우선순위(높은 순서부터 작성)
- !important: 어떤 스타일보다 우선 적용되는 스타일
- 인라인 스타일: 해당 태그에만 적용되는 스타일
- id 스타일: 문서 안에서 단 한번만 사용하는 스타일
- class 스타일: 문서 안에서 여러번 사용할 수 있는 스타일
- HTML 태그 스타일: 문서 안의 같은 태그에 모도 적용
- 부모 요소에 의해 상속된 속성
728x90
'HTML, CSS' 카테고리의 다른 글
[HTML] 이미지 사용하기 (0) | 2023.01.04 |
---|---|
[HTML] 표 만들기 (0) | 2023.01.04 |
[HTML] 목록 만들기 (0) | 2023.01.04 |
[HTML] 텍스트 태그 (0) | 2023.01.04 |
[HTML] 시맨틱 태그(Semantic Tag)란? (0) | 2023.01.03 |