qwef

#box p::first-letter {font-size: 300%;} #box내의 p중 첫번째 글자만 ::는 엘리멘트 안의 내용을 가리키는 거고 :는 엘리멘트를 가르키는 거인듯? #box p:first-child {color: green;} #box p:last-child {color: purple;} #box p:nth-child(2) {background-color: aquamarine;} .line::first-line {background-color: orange;} 이거는 앞이나 뒤에 뭐 내용넣어주는 그런거 인 듯. 블록 요소로 보임 그냥 뭐 태그로 넣는게 아니라 그냥 내용 넣는거임. #box::after {content: '항목을 선택해 주세요.'; color: green;} #box::be..

ul.classname ul중 classname인 ul ul .classname ul 자손들 중 .classname인 것들 + 인접 선택자. #outbox + .outbox2 동일한 수준에서 선택 이건 하나만 선택 됨 붙어 있어야 함. 같은 형제라도 떨어져 있으면 안됨. 위쪽 말고 아래쪽 ~ 형제 선택자 #outbox ~ div outbox와 형제 수준의 div 모두 선택 종속선택자 일종의 교집합.. 포함되어지는.. 예를 들어 면 .small{} css와 .highlight-color{} CSS 모두 적용됨. 굳이 small.highlight-color{} 아니어도. input[type=checkbox]:checked + div.text_box{ visibility: visible; opacity: 1;..

inline 좌우만 신경씀 block 위아래, 좌우 다 신경씀, 줄바꿈. inline-block 위아래, 좌우 다 신경씀, 줄바꿈X

margin은 바깥쪽으로 여백, padding은 안쪽으로 여백(즉, 내 상자와 상자안의 컨텐츠) 즉, padding은 자신의 크기를 키움. 블록태그는 이 margin이 위아래로 있음.

ol ul dl 다 안에 h 제목형 태그가 들어가면 안됨. 문제 유형별 1. 문제 유형에 대한 설명은 ... 1. 문제 유형에 대한 설명은 ... 1. 문제 유형에 대한 설명은 ... 이거 됨 하나에 대해 여러개로 설명 가능 문제 유형별 문제 유형별 문제 유형별 1. 문제 유형에 대한 설명은 ... 이건 안됨. 는 Definition Title 는 Definition Data 하나의 타이틀에 여러 데이타

가운데 정렬을 주고싶을경우 inline속성은 text-align:center, block속성은 margin: 0 auto width값 따로 안주면 100% margin: 0 auto 위아래 0이고 좌우 자동으로 하면 가운데에 딱 됨.

document.querySelector('클래스명'); '' 까지 해야 함 저렇게 해서 접근 가능함. style 다룰려면 변수이름.style.backgroundColor = 'blue'; 이런 식으로 하면 됨. 버튼의 경우 btn.addEventListener('click', function(){ divBox.style.backgroundColor = 'blue'; }); 이런 식으로 이벤트 추가 가능

인라인, block 다 가능. span 블록요소 못함. span 태그 안에는 블록요소인태그(h1, p 등) 못 넣음.

용도 3가지 id를 통해 같은 문서의 특정id가 있는 위치로 이동한다. 다른 웹페이지로 이동. 파일로 이동.

div { width: 600px; height: 200px; border: 1px solid #808080; h3 { font-size: 32px; color: #ffa500; &+p{ color: #333; font-size: 20px; } } } &란 자기 자신을 뜻함. h3 내에서 &를 썼으니 h3이 & div { width: 600px; height: 200px; border: 1px solid #808080; } div h3 { font-size: 32px; color: #ffa500; } div h3 + p { color: #333; font-size: 20px; } css로 빌드 된 파일임. &가 자기 자신보다 부모. 라는게 더 정확함. .container &{ h1{ color:$colo..