728x90
※ 디자인 변경 작업 수행 중 필요한 내용 정리 ※
1. 다중 클래스
.a, .b, .c{}
- 쉼표를 사용한 연결
- 각각의 항목을 or로 적용
- 나열한 모든 클래스 혹은 id, 태그에 적용되고, 각 클래스는 따로 사용
.a .b .c{}
- 공백을 사용한 연결
- 뒤에나온 선택자가 하위 개체로 지정
- 즉, A요소 내부의 B요소 내부에 있는 C요소에만 적용
.a.b.c{}
- 공백없이 연결
- class="a b c"처럼 모든 속성을 한번에 만족하는 요소에만 적용
[참고]
https://padahkim.tistory.com/34
2. bold
font-weight 속성에 bold값을 주어도 계속 무시되는 현상
위의 이미지처럼 기본적으로 element.style이 적용되어 있는 것이 확인되었다.
알고보니 기본적으로 semibold를 적용한 상태여서 이를 normal한 상태로 변경해주었다.
▶ 개발자 도구를 통해 스타일 적용 방식을 확인하여 적용이 안되는 이유에 대해 알아보기!
▶ 스타일을 적용할 때 먼저 선언된 스타일이 있는지 확인하기!
728x90
'WEB > CSS' 카테고리의 다른 글
[CSS] 글자 관련 CSS 정리 (0) | 2023.02.16 |
---|---|
[CSS] 여백(margin/padding) 기본 개념 정리 (0) | 2023.02.12 |
[CSS] CSS 선택자(Selector) 정리 (0) | 2023.02.12 |
[CSS] 구글 웹 폰트 사용해보기 (0) | 2023.02.07 |
[CSS] 배경(background) 관련 기본 CSS 사용해보기 (0) | 2023.02.06 |