Dictionary는 ㅇㅇ클래스 및 속성 값 규격화를 정의합니다.
| 구분1 | 구분2 | 예약어 | 클래스 명 | 설명 |
|---|---|---|---|---|
| Display |
d-
|
d-bk: block;
d-inbk: inline-block;
|
||
| Position |
pos-
|
pos-rel
pos-abs
pos-fix
|
pos-rel: position: relative pos-fix: position: fixed | |
| Width |
w-
|
w-auto
w-50
w-100
|
w-100: width: 100% | |
| Height |
h-
|
|||
| Margin |
mg-
mt-
mb-
mr-
ml-
|
mt-20: margin-top: 20px
mr-20: margin-right: 20px
|
||
| Padding |
pd-
pt-
pb-
pr-
pl-
|
pt-20: padding-top: 20px
pr-20: padding-right: 20px
|
||
| Background |
bg-
|
|||
| Border |
bd-
|
bd-blue: border 1px solid blue
|
||
| Initalize |
-init
|
bg-init: background: none
|
스타일 초기화 관련 클래스 | |
| Text-align |
txt-
|
txt-l
txt-c
txt-r
|
txt-c : text-align: center txt-l : text-align: left | |
| Reverse (반전) |
rev-
|
|||
| Scroll |
scroll-
|
scroll-x
scroll-y
|
||
| Color |
col-
|
col-txt
col-tlt
col-pri
col-sec
col-gray
|
||
| Description (설명) |
desc-
|
|||
| Table |
tbl-
|
tbl-col
tbl-row
|
tbl-col : 행이 제목인 경우(리스트 형태) / tbl-row : 열이 제목인 경우(입력 형태) | |
| Button |
btn-
|
btn-basic
btn-sm
btn-ico
btn-pri
btn-bk
|
||
| Form | checkbox |
chk-
|
||
| Form | search |
sch-
|
||
| Img |
img-
|
|||
| Icon |
ico-
|
ico-xl
ico-l
ico-m
ico-s
ico-xs
|
||
| Container |
-inner
|
inner : max-width: 1280px margin 0px auto | ||
| Infomation |
info-
|
info-suc
info-fail
info-bullet
|
txt-suc: 조건 부합, txt-fail: 실패 | |
| Attribute (속성) |
attr-
|
|||
| Number |
num-
|