일_공부 (4) 썸네일형 리스트형 css 알아두기 이번 css는자주는 아니지만 알아두면 좋은 것들이다.그냥 이해만 해두자 Selector 구분예제 css 결과 비고 :active111222 a:active {background-color: yellow;} 111 222 마우스 클릭시 배경색을 준다 ::after 1 2 p::after {content: "- txt"; background-color: yellow;} 1- txt2- txt p 태그 뒷쪽에 추가로 나온다 ::before1 2 p::before {content: "txt -"; background-color: yellow;} txt -1txt -2 p 태그 앞쪽에 추가로 나온다 :checked 1 234 input:checked {height: 30px;width: 30px;} 1 2 3 4.. 수정시 유용한 css 이제 부터 잘 알아두어야 한다. 고정된 소스에 css만 수정해야할 때 유용한 것들이다. 보통 기존 소스에서 디자인이 수정되었을때 많이 한다. 이런일이 안생기게 css 구조 설계가 잘되어 있어야하는데 보통 수정사항이 많아지고 구조가 바뀌면서 덕지덕지 붙여야하는 경우가 많다. Selector 구분예제 css 결과 비고 element > element 1 2 div > p {background-color: yellow;} 1 2 div안 p 태그만 적용 element + element 1 2 3 4 div + p{background-color: yellow;} 1 2 3 4 div 다음에 오는 p 태그만 적용 element ~ element 1 2 3 4 div ~ p {background-color: yel.. css 기본 css를 할때 반복적으로 많이 쓰게 되는 것들이 있다. Selector 구분예제 css .class .wrap{} #id #wrap{} * *{} element p{} element element div p{} element,element div,p{} CSS Selector Reference css를 처음 아는 마음으로 하나하나 차근차근 배워보자 Selector Example Example description .class .intro class="intro"가 있는 모든 요소를 선택합니다. #id #firstname id="firstname"를 사용하여 요소를 선택합니다. * * 모든 요소를 선택합니다. element p 모두 요소를 선택합니다. element,element div, p 모두 요소와 요소를 선택합니다. element element div p 요소 내에서 요소를 모두 선택합니다. element>element div > p 상위 항목인 요소가 있는 모든 요소를 선택합니다 element+element div + p 요소 바로 뒤에 배치된 모든 요소를 선택합니다. element1~.. 이전 1 다음
