본문 바로가기

Mark Up/CSS14

[CSS] Chapter 04. 선택자(Selector)_2 1. 주요 선택자 - Type, Class, ID 2. 속성 선택자 - [attr], [attr=value] 3. 속성 선택자 -[attr^], [attr$], [attr_] 4. 가상클래스 선택자 - first-child, last-child, nth-child 5. 가상클래스 선택자 - first-of-type, last-of-type, nth-of-type 6. 가상클래스 선택자 - not 7. 가상클래스 선택자 - link, visited 8. 가상클래스 선택자 - hover, active, focus 9. 가상클래스 선택자 - enabled, disabled, checked 10. 가상요소 선택자 - before, after 11. 가상요소 선택자 - first-letter, first-line.. 2022. 11. 25.
[CSS] Chapter 03. 선택자(Selector)_1 1. 주요 선택자 - Type, Class, ID 2. 속성 선택자 - [attr], [attr=value] 3. 속성 선택자 -[attr^], [attr$], [attr_] 4. 가상클래스 선택자 - first-child, last-child, nth-child 5. 가상클래스 선택자 - first-of-type, last-of-type, nth-of-type 6. 가상클래스 선택자 - not 7. 가상클래스 선택자 - link, visited 8. 가상클래스 선택자 - hover, active, focus 9. 가상클래스 선택자 - enabled, disabled, checked 10. 가상요소 선택자 - before, after 11. 가상요소 선택자 - first-letter, first-line.. 2022. 11. 24.
[CSS] Chapter 02. Cascading 원칙 (적용 우선순위) Cascading : 폭포같은, 계단식의, 위에서 아래로 흐르는, 연속적인 CSS 개발을 할 때, 흔히 겪을 수 있는 실수 : 요소에 CSS를 줬지만 적용되지 않을 때 1. 스타일 우선순위 2. 스타일 상속 1. 스타일 우선순위 선언된 위치 : 동일한 스타일이라도 선언된 곳에 따라 우선순위가 정해진다 브라우저 기본 스타일 < 외부 스타일(External) < 내부 스타일(Embedded) < inline 스타일 Specificity(명시도) : 적용 범위가 더 구체적일수록 우선적으로 적용된다. tag 스타일 < class 스타일 < id 스타일 < inline 스타일 단순 tag로 지정된 스타일 < id/class/attribute 등 직접 지정한 스타일 id는 calss보다 우선이다. 부모로부터 상속받.. 2022. 11. 24.
[CSS] Chapter 01. CSS 적용 1. 내부 스타일 (embedded) 2. 인라인 스타일 (inline) 3. 외부 스타일 (external) 1. 내부 스타일 (embedded) 코드는 위에서부터 아래로 읽는다. style 태그는 body 태그 안에 맨 마지막에 놔둬도 적용이 된다. 렌더링이 잘 되지만, 추후 웹 페이지에 다양한 기능들로 인해 스크립트들이 추가되고, 맨 마지막에 style 태그 코드가 있다면? 맨 처음에는 style 적용이 안된 상태로 렌더링이 되었다가 다양한 기능 로딩후에 style 적용이 된 상태로 렌더링 될 것이다. 그래서 style 태그는 head에 정의해두는 것이다. 2. 인라인 스타일 (inline) Welcom! 3. 외부 스타일 (external) link 태그의 위치는 최상단에 두어야 한다. html의.. 2022. 11. 24.