목록분류 전체보기 (108)
Jade_o.o
1. 가상 클래스 선택자 1-1 hover, active, focus, checked - E:active {} E 요소에 마우스 클릭 또는 키보드 엔터가 눌리는 동안 - E:hover {} E 요소에 마우스가 올라가 있는 동안 - E:focus {} E 요소에 포커스가 머물러 있는 동안(input, textarea) - E:checked {} E 요소가 체크 되었을 때 (radio, checkbox) 1-2 순서와 관련된 가상클래스 선택자 - E:first-child E 요소가 첫번째라면 선택 - E:last-child E 요소가 마지막이라면 선택 - E:nth-child(n) E 요소가 n번째라면 선택 - 괄호 안에는 숫자,n과 관련된 수식, odd/even 키워드 - E:not(XYZ) E 요소 중에..
selector의 복합 선택자를 연습해보자 #(id) .(class) > (자식요소) (띄어쓰기(후손 선택자)) + ~(인접형제 선택자) 선택자 배우기 첫번째 section 전래동화 토끼와 거북이 선녀와 나무꾼 햇님 달님 콩쥐 팥쥐 두번째 section 신데렐라 백설공주 #(id) / .(class) > (자식요소) (띄어쓰기(후손 선택자)) + ~(인접형제 선택자)
selector의 기본 선택자를 연습해보자 #(id) / .(class) 기본 선택자 연습하기 기본선택자 연습을 해보아요! 안녕하세요 1 2 3 4 5
태그별로 css 적용 방법 응용 및 실습을 해보자 주석 참고하며 헷갈리는 방식 재차 작성해보며 익혀보자 h1태그는 인라인 방식 h2태그는 내장 방식 p태그는 링크 방식 span태그는 @import방식 h3태그는 내장방식과 링크방식 선언 하지만 내장방식이 적용되도록 html 코드 @import url('./css_import1.css'); p{ background-color: red; color:white; } h3{ background-color: black; color:white } css 코드 => 코드 실행 시 결과창