Dev/HTML.CSS.Sass6 [CSS] z-index z-index 예제 Lorem ipsum, dolor sit Lorem ipsum, dolor sit Lorem ipsum, dolor sit div { box-sizing: border-box; margin: 10px; padding: 10px; width: 100px; height: 100px; border: 10px solid #000; background: red; font-size: 16px; font-weight: 700; /*font-weight : 300(thin) | 400(normal) | 500(medium) | 700(bold) | 900 (extra bold)*/ color: #000; /*text-align : center | left(default) | right */ /*ov.. 2022. 3. 16. [CSS] display # display none 안 보이게 하는 것. block 123 123 123 div { display: block; } .div1 { background-color: red; } .div2 { background-color: blue; } .div3 { background-color: green; } 모든 div는 기본적으로 block요소임. inline-block 123 123 123 div { display: inline-block; } .div1 { background-color: red; } .div2 { background-color: blue; } .div3 { background-color: green; } 내가 가진 영역만큼만 잡힘. 흰 공백은 enter를 쳤을 경우 생김. 123123.. 2022. 3. 14. [CSS] position position relative, absolute 123 div { position: relative; top: 10px; left: 10px; width: 100px; height: 100px; background-color: red; } div span { position: absolute; top: 10px; left: 10px; background-color: yellow; } absolute는 기준점이 body가 아니라 자기자신(span)이 속해있는 부모(div). span이 가지고 있는 위치는 그 부모인 div가 기준이 됨. fixed body { height: 1000px; } div { position: fixed; top: 0; width: 100%; height: 32px; backgr.. 2022. 3. 14. [HTML] 기본 HTML # 기본 HTML 자주 쓰는 것들 위주로 정리 section 보통 영역을 구분할 때 사용 p, span Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remain.. 2022. 3. 10. 이전 1 2 다음
