728x90 반응형 SMALL CSS3 [CSS] CSS 우선순위 CSS 우선순위 우선순위란 같은 태그에 여러 CSS가 적용되었을 때, 어떤 선언의 CSS속성을 우선 적용할지 결정하는 방법입니다. 1. 점수가 높은 선언이 우선됨. 2. 같은 점수일 경우, 가장 마지막에 해석된 선언이 우선됨. 아래의 코드에 CSS 우선순위 점수를 표시해 보겠습니다. Nice! div {color: white !important;} /* !important : 최우선 적용 */ #ColorRed {color: red;} /* ID선택자 : 100점 */ .ColorOrange { color: orange; } /* Class선택자 : 10점 */ div { color: green;} /* 태그 선택자 : 1점 */ * { color : blue } /* 전체 선택자 0점 */ 결과적으로 .. 2022. 1. 5. [CSS] CSS 선택자(1) 이번 시간에는 CSS 선택자에 대해 알아보겠습니다. CSS 선택자 기본 복합 1. 기본 선택자 - * : 전체 선택자 (Universal Selector) , 모든 요소를 선택. - X : 태그 선택자(Type Selector) , 태그 이름이 X인 요소 선택. h1 { color: red; } -. X : 클래스 선택자(Class Selector), HTML Class속성의 값이 X인 요소 선택. 클래스 이름이 같기 때문에 태그가 달라도 CSS가 적용이 됨. Hello 안녕하세요 반가워! 잘가! .red { color: red; } - #X : 아이디 선택자(ID Selector), HTML id속성의 값이 X인 요소 선택. '반가워!'만 글자 색이 변경됨. Hello 안녕하세요 반가워! 잘가! .re.. 2022. 1. 5. [CSS] CSS 선언 방식 이번 시간에는 CSS 선언 방식에 대해 알아보겠습니다. CSS 선언 방식 - 내장 방식 - 인라인 방식 - 링크 방식 - @import 방식 1. 내장 방식 을 사용하여 스타일을 작성하는 방식. style 요소는 HTML의 해더 요소에 작성을 합니다. 즉, CSS 내용을 HTML의 style태그 내부에 작성하여 HTML자체에 내장 한다는 뜻입니다. 장점 : 별도의 CSS파일을 만들지 않아도 된다. 단점 : 프론트앤드 개발을 할 때 HTML, CSS, JS 파일을 분할하는 것이 유지보수 측면에서 좋다. => 유지보수 측면에서 단점이 많다. ( 프로젝트를 번들하는 과정에서 컴퓨터가 자동으로 파일을 내장방식으로 심는 경우는 문제가 되지 않는다. ) 2. 인라인 방식 요소의 style 속성에 직접 스타일을 하는.. 2022. 1. 5. 이전 1 다음 728x90 반응형
