어쩔수없죠

!important 을 이용하면 css 적용순위를 무시하고 무조건 적용된다. 사용방법은 속성값 뒤에 붙이기 .text { color: black !important }

:only-child 가상 클래스 어떤 요소에 자식이 하나밖에 없을때 적용됨 예시) html태그는 이렇게 해놓고 자식1 자식2 자식2 css는 이렇게 수정 div>span { display: inline-block; width: 100px; height: 100px; } span:only-child { background-color: lime; } 하면 자식1인 span만 배경색이 지정된다.

span 태그는 div 나 p 태그와 달리 너비나 높이가 없음 그래서 display를 block 레벨로 설정해주고 사용해야함

::placeholder 가상 셀렉터를 사용하면 색상을 변경할 수 있어요. ::-webkit-input-placeholder { /* 크롬 4–56 */ color: #9e9e9e; } :-moz-placeholder { /* 파이어폭스 4–18 */ color: #9e9e9e; opacity: 1; } ::-moz-placeholder { /* 파이어폭스 19–50 */ color: #9e9e9e; opacity: 1; } :-ms-input-placeholder { /* 인터넷 익스플로러 10+ */ color: #9e9e9e; } ::placeholder { /* 파이어폭스 51+, 크롬 57+ */ color: #9e9e9e; opacity: 1; } 각각의 prefix는 따로 적어야 한다는 점을..

first-child 셀렉터는 첫 번째 자식을 선택해요. first-of-type 셀렉터는 같은 타입 중 첫 번째인 경우 선택해요. 그러니까 예를 들어: 제목 첫 번째 문단 두 번째 문단 세 번째 문단 여기에서 첫 번째 문단을 선택하고 싶은 경우 p:first-of-type 을 사용해야 해요. (첫 번째 자식은 h1 이기 때문에 :first-child 는 사용할 수 없어요.) p:first-of-type { color: green; }

CSS3에서 뷰포인트 퍼센트 단위를 사용 뷰포인트 퍼센트 길이는 최초 포함 블럭의 사이즈에 비례합니다. 최초 포함 블럭의 높이 또는 너비가 변경된 경우, 뷰포인트 퍼센트 길이는 따라서 크기가 변경됩니다. 뷰포인트 퍼센트 단위는 vw (뷰포인트 너비), vh (뷰포인트 높이), vmin (뷰포인트 너비와 높이 중 최소값), vmax (뷰포인트 너비와 높이 중 최대값) 가 있어요. div를 창의 높이와 같게 만드려면 div의 height를 100vh로 설정해주면 되겠죠. .element { width: 100%; height: 100vh; }