분류 전체보기 (18) 썸네일형 리스트형 HTML,CSS[2020.05.04 float 복습] float =공간을 최소한으로 차지 하되 가로정렬한다. !!block 요소만 float 요소를 무시한다. !! 4개의 div 블럭을 모두 가로정렬 해보자 1. 4개의 블럭 너비를 25% display를 inline-block 을 줬는데도 가로에 모두 정렬되지 않는다. =inline-block 주변에는 항상 애매한 여백이 남기때문이다. 2.display:block 요소는 한줄을 혼자 쓴다. 3.float:left를 주어 모두 한줄에 가로 정렬 되었지만 부모인 section의 테두리 안에 가둬지지 않았다. =section의 display는 block이기 때문에 float인 div를 무시한다. block요소만 float 요소를 무시한다 4.::after를 이용해 section의 막내를 만들어주고 display.. float 노트 필기 2020.04.29 포토샵 네온 만들기 Layer-Layer Style 과 Select-Modify 를 이용한 네온 만들기 2020.04.27 HTML,CSS 수업 내용 - before,after- after,before:HTML에 100개의 텍스트가 있다고 할 경우에, 각 100개의 텍스트의 앞이나 뒤에 추가 내용을 붙이고 싶을 때, 하나하나 HTML을 수정하지않고 CSS before,after를 활용해 추가해주면 편리하게 할수 있다. *after와 before의 display는 inline 이다.* *before은 태그에 첫번째 자식 after는 막내자식이다.* -transition- =요소가 변할 때 변하는 과정 즉, 애니메이션 효과 ex) div{ transition: width 1s;} = 돌아갈때 애니메이션 (평소작동) div:hover>div{ transition: width 3s} = 발동 애니메이션 (마우스 올렸을 때 작동) *transition 은 시작.. 노트 필기 [02 position,before.after,transition] 노트 필기 [01 HTML,CSS,display] 평일 공부 계획 10시기상 1시 학원출발 2시 학원도착 2시 . . . 7시 수업 끝 8시 집 도착 ~~ 9시 저녁 먹기 10시 복습시작(최소 3시간) 1-2시 복습 끝 취침!! 1.2.3차 풀다운 메뉴 만들기. 이전 1 2 3 다음
