개발 공부

CSS 우선순위 - 같은 요소가 여러 선언의 대상이 된 경우, 어떤 선언의 CSS 속성을 우선 적용할지 결정하는 방법 1. 점수가 높은 선언이 우선함. 2. 점수가 같으면, 가장 마지막에 해석된 선언이 우선함. - 점수 ID 선택자 : 100 Class 선택자 : 10 tag 선택자 : 1 전체(*) 선택자 : 0 인라인 선언 : 1000 - 스타일 속성에 " !important " 를 입력하면 우선순위가 0순위로 적용됨. ex) .green{ color: green !important; } - 다음과 같이 스타일 적용 시 div 태그 안의 글자는 어떤 색으로 표시되는가? .green{ color: green; } 우선순위! => 인라인으로 선언한 속성이 우선이므로 orange 색으로 표시됨.

상속(Inheritance) - 부모 요소에서 설정된 일부 CSS 속성 값이 자식 요소에게 상속되며, 일부는 그렇지 않다. - 상속되는 CSS 속성들 -> 글자/문자 관련 속성들 ( 모든 글자/문자 속성은 아님 ) font-style : 글자 기울기 font-weight : 글자 두께 font-size : 글자 크기 line-height : 줄 높이 font-family : 폰트(서체) color : 글자 색상 text-align : 정렬 ... 예) 스타일 상속 1 .parent1{ color: red; } 조부모 부모1 자식1 자식2 자식3 부모2 => 결과

- CSS 선택자 1. 기본 선택자 2. 복합 선택자 3. 가상 클래스 4. 가상 요소 선택자 5. 속성 - 적용 파일 index.html 리스트 1 리스트 2 리스트 3 div 태그 p 태그 span 태그 1. 기본 선택자 1-1. 전체 선택자(Universal Selector) - *(Asterisk) 를 지정 - 모든 요소를 선택한다. * { color: red; } 1-2. 태그 선택자(Type Selector) - 태그를 지정 - 지정한 요소를 선택 li{ color:red; } 1-3. class 선택자(Class Selector) - 클래스를 선택 .c1{ color:red; } 1-4. id 선택자(Id Selector) - id를 선택 #i1{ color:red; } 2. 복합선택자 2-..

- CSS 선언 방식은 네 가지가 있다. 1. 내장 방식 2. 링크 방식 3. 인라인 방식 4. @import 방식 1. 내장 방식 - html 문서 안의 의 내용으로 스타일을 작성하는 방식 - CSS 내용이 많아지면 HTML 문서 안에서 한번에 처리하기 어렵다. 예) p { font-size: 20px; } 2. 링크 방식 - 로 외부 CSS 문서를 가져와서 연결하는 방식 예) 3. 인라인 방식 - 요소의 style 속성에 직접 스타일을 작성하는 방식. - 선택자 지정 없음. 예) p 태그 4. @import 방식 - CSS의 @import 규칙으로 CSS 문서 안에서 또 다른 CSS 문서를 가져와 연결하는 방식 예) - main.css @import url("./p.css"); - p.css p{ f..

- CSS 는 다음과 같이 작성한다. 선택자{ 속성: 값; } -> 선택자 : 스타일(CSS)을 적요할 대상(Selector). 요소, id, class 등. 속성 : 스타일(CSS)의 종류(Property) 값 : 스타일(CSS)의 값 예) span { color:red; } - 주석은 다음과 같이 작성한다. /* 주석 내용 */ 예) span { color:red; /* span 태그 안의 문자 색을 빨간색으로 지정 */ }

- HTML 문서를 작성하다 보면 초기에 CSS가 설정되어 있는 것을 알 수 있다. - 이를 초기화 하기 위해 CSS를 초기화하는 파일이나 링크를 이용할 수 있다. - 구글에 "reset-css cdn" 을 입력하면 CSS 초기화 파일 혹은 링크를 공유하는 웹 사이트를 찾을 수 있다. https://www.jsdelivr.com/package/npm/reset-css jsDelivr - A free, fast, and reliable CDN for Open Source Supports npm, GitHub, WordPress, Deno, and more. Largest network and best performance among all CDNs. Serving more than 80 billion re..