일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
Tags
- datalist
- 깃헙
- 다시볼 것
- 부스트코스
- 가상클래스 선택자
- 속성 선택자
- 김성박
- vmax
- 소스트리
- nth-of-type()
- jsp
- 웹개발
- 부정 선택자
- spring
- 보충필요
- 다시보자
- vmin
- 가상요소 선택자
- 복합 선택자
- 즐거운 자바
- optgroup
- 상속
- 자바
- 즐거운자바
- nth-child()
- HTML Templating
- 서블릿
- JavaScript
- EDWITH
- ES6
Archives
- Today
- Total
기억의 DataBase
ETC( border / none,opacity / overflow / line-height ) 본문
border: 두께 종류 색상 (종류만 지정해도 보여짐 - solid)
<div class="box"></div>
.box {
width: 200px;
height: 200px;
background: orange;
padding: 10px;
border: 10px solid red;
box-sizing: border-box;
}
box-sizing: border-box;
(border/padding 모두를 포함한 크기 200/200)
(padding/border등을 사용할 때 계산할 필요없이 본래 크기(w/h)를 유지)
display: none(아예 존재하지 않음 - 삭제)과
opacity: 0(단순히 보이지 않음 - 투명)은 다른 의미
* opacity 0~1(0투명/1불투명)
.hide {
display: none;
}
class="hide" 를 JS로 줘서 지워줄 수도 있다.
overflow: visable(기본값) / hidden / scroll / ***auto(박스를 넘어가면 스크롤이 나옴)
line-height : 따로 지정하지 않으면 글자와 동일(한줄의 두께와 동일)
숫자만 쓰면 글자 크기의 배수(수정할 필요를 줄임 - 1.4 ~1.7 권장)
'CSS' 카테고리의 다른 글
flex (0) | 2020.04.08 |
---|---|
float (0) | 2020.04.08 |
Size( pixel / % / em / rem / vw / vh / vmax / vmin ) (0) | 2020.04.08 |
Emmet (0) | 2020.04.08 |
우선순위와 상속 / 초기화 (0) | 2020.04.08 |
Comments