본문 바로가기

Webstoryboy

Category

Explanation

CSS

 (238)
[CSS] counter-reset counter-reset counter-reset 속성은 콘텐츠의 숫자를 초기화합니다. counter-reset counter-reset 속성은 콘텐츠의 숫자를 초기화합니다. 특징 설명 기본 값 counter-reset : none; 적용 - 버전 CSS2 정의(Definition) counter-reset 속성은 콘텐츠의 숫자를 초기화합니다. 문법(Syntax) counter-reset : none | name | number 속성(Property) 속성값 설명 none 콘텐츠의 숫자를 적용하지 않습니다. name 콘텐츠의 이름을 설정합니다. number 콘텐츠의 숫자를 설정합니다. 호환성(Compatibility) 6 7 8 9 10 11 counter-reset 사용가능 사용가능 사용가능 사용가능 ..
[CSS] counter-increment counter-increment counter-increment 속성은 콘텐츠의 순서 상태를 정의합니다. counter-increment counter-increment 속성은 콘텐츠의 순서 상태를 정의합니다. 특징 설명 기본 값 counter-increment : none; 버전 CSS2 정의(Definition) counter-increment 속성은 콘텐츠의 순서 상태를 정의합니다. 문법(Syntax) counter-increment : none | id 속성(Property) 속성값 설명 none 콘텐츠의 순서 상태를 적용하지 않습니다. id 콘텐츠의 순서 상태를 id를 통해 설정합니 호환성(Compatibility) 6 7 8 9 10 11 counter-increment 사용가능 사용가능 사용..
[CSS] content content content 속성은 콘텐츠 내용을 설정합니다. content content 속성은 콘텐츠 내용을 설정합니다. 특징 설명 기본 값 content : normal; 버전 CSS2 정의(Definition) content 속성은 콘텐츠 내용을 설정합니다. 문법(Syntax) content : normal | none | counter | attr | string | open-quote | close-quote | no-open-quote | no-close-quote | url 속성(Property) 속성값 설명 normal 콘텐츠 내용(기본)을 설정하지 않습니다. none 콘텐츠 내용을 적용하지 않습니다. counter 콘텐츠 내용에 번호를 설정합니다. attr 콘텐츠 내용에 CSS 속성을 ..
[CSS] columns columns columns 속성은 열의 폭과 열의 수를 정의합니다. columns columns 속성은 열의 폭과 열의 수를 정의합니다. 특징 설명 기본 값 column-width : auto; column-count : auto; 적용 column 버전 CSS3 정의(Definition) columns 속성은 열의 폭과 열의 수를 정의합니다. column-width와 column-count를 같이 사용할 경우 count가 우선 적용됩니다. 문법(Syntax) columns : auto | column-width | column-count /* 단위 속성이 있는 경우 : column-width 설정 */ columns: 12em; /* 단위 속성이 없는 경우 : column-count 설정 */ col..
[CSS] column-width column-width column-width 속성은 컬럼의 가로 값을 정의합니다. column-width column-width 속성은 컬럼의 가로 값을 정의합니다. 특징 설명 기본 값 column-width : auto; 적용 column 버전 CSS3 정의(Definition) column-span 속성은 컬럼의 가로 값을 정의합니다. 문법(Syntax) column-width : auto | length /* 키워드 속성을 사용하는 경우 */ column-width : auto; /* 단위 속성을 사용하는 경우 */ column-width : 100px; column-width : 40vw; column-width : 6rem; /* 글로벌 속성을 사용하는 경우 */ column-width: in..
[CSS] column-span column-span column-span 속성은 열의 속성을 정의합니다. column-span column-span 속성은 열의 속성을 정의합니다. 특징 설명 기본 값 column-span : none; 적용 column 버전 CSS3 정의(Definition) column-span 속성은 열의 속성을 정의합니다. 문법(Syntax) column-span : none | all /* 키워드 속성을 적용한 경우 */ column-span: none; column-span: all; /* 글로벌 속성을 적용한 경우 */ column-span: inherit; column-span: initial; column-span: unset; 속성(Property) 속성값 설명 none 기본 컬럼의 위치를 설정합니다..
[CSS] column-rule-width column-rule-width column-rule-width 속성은 컬럼 라인의 가로값을 정의합니다. column-rule-width column-rule-width 속성은 컬럼 라인의 가로값을 정의합니다. 특징 설명 기본 값 column-rule-width : medium; 적용 column 버전 CSS3 정의(Definition) column-rule-width 속성은 컬럼 라인의 가로값을 정의합니다. 문법(Syntax) column-rule-width : medium | thin | thick | length /* 키워드 속성을 이용하는 경우 */ column-rule-width: thin; column-rule-width: medium; column-rule-width: thick; /* 단위..
[CSS] column-rule-style column-rule-style column-rule-style 속성은 컬럼 라인의 스타일을 정의합니다. column-rule-style column-rule-style 속성은 컬럼 라인의 스타일을 정의합니다. 특징 설명 기본 값 column-rule-style : none; 적용 column 버전 CSS3 정의(Definition) column-rule-style 속성은 컬럼 라인의 스타일을 정의합니다. 문법(Syntax) column-rule-style : none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset /* 테두리 스타일 속성을 사용하는 경우 */ column-rule-style: none; colu..
[CSS] column-rule-color column-rule-color column-rule-color 속성은 컬럼의 라인 색을 정의합니다. column-rule-color column-rule-color 속성은 컬럼의 라인 색을 정의합니다. 특징 설명 기본 값 column-rule-color : correntColor; 적용 column 버전 CSS3 정의(Definition) column-rule-color 속성은 컬럼의 라인 색을 정의합니다. 문법(Syntax) column-rule-color : color /* 키워드 컬러 속성을 사용하는 경우 */ column-rule-color: red; /* rgba 속성을 사용하는 경우 */ column-rule-color: rgb(46, 23, 0); column-rule-color: rgba..
[CSS] column-rule column-rule column-rule 속성은 컬럼 라인의 가로값, 스타일, 컬러를 정의합니다. column-rule column-rule 속성은 컬럼 라인의 가로값, 스타일, 컬러를 정의합니다. 특징 설명 기본 값 column-rule-width : medium; column-rule-style : none; column-rule-color : color; 적용 column 버전 CSS3 정의(Definition) column-rule 속성은 컬럼 라인의 가로값, 스타일, 컬러를 정의합니다. 문법(Syntax) column-rule : column-rule-width | column-rule-style | column-rule-color /* 한 가지 속성 column-rule-style을 적용한 ..
[CSS] column-gap column-gap column-gap 속성은 컬럼의 간격을 정의합니다. column-gap column-gap 속성은 컬럼의 간격을 정의합니다. 특징 설명 기본 값 column-gap : normal 적용 column 버전 CSS3 정의(Definition) column-gap 속성은 열의 간격을 정의합니다. 처음에는 grid-column-gap 속성으로 사용하였지만 현재는 grid가 생략되어 column-gap으로 사용합니다. grid 속성에서 간격을 주기 위해서는 grid-column-gap으로 사용합니다. 문법(Syntax) column-gap : length | normal /* 키워드 속성을 사용한 경우 */ column-gap: normal; /* 단위 속성을 사용한 경우 */ column-..
[CSS] column-fill column-fill column-fill 속성은 열의 지정방법을 정의합니다. column-fill column-fill 속성은 열의 지정방법을 정의합니다. 특징 설명 기본 값 column-fill : balance 적용 column 버전 CSS3 정의(Definition) column-fill 속성은 열의 지정방법을 정의합니다. 문법(Syntax) column-fill : auto | balance | balance-all /* 키워드 속성을 사용하는 경우 */ column-fill: auto; column-fill: balance; column-fill: balance-all; /* 글로벌 속성을 사용하는 경우 */ column-fill: inherit; column-fill: initial; col..
[CSS] column-count column-count column-count 속성은 컬럼의 수를 정의합니다. column-count column-count 속성은 컬럼의 수를 정의합니다. 특징 설명 기본 값 column-count : auto 적용 column 버전 CSS3 정의(Definition) column-count 속성은 컬럼의 수를 정의합니다. 문법(Syntax) column-count : number | auto /* 키워드 속성을 적용한 경우 */ column-count: auto; /* 숫자 속성을 적용한 경우 */ column-count: 4; /* 글로벌 속성을 적용한 경우 */ column-count: inherit; column-count: initial; column-count: unset; 속성(Proper..
[CSS] color color color 속성은 글씨 색을 설정합니다. color color 속성은 글씨 색을 설정합니다. 특징 설명 기본 값 color : 브라우저마다 다양함(브라우저 기본 색) 적용 font 버전 CSS1 정의(Definition) color 속성은 글씨 색을 설정합니다. font-color 속성은 존재하지 않습니다. 문법(Syntax) color : color 속성(Property) 속성값 설명 color 폰트 컬러 값을 설정합니다. 호환성(Compatibility) 6 7 8 9 10 11 color 사용가능 사용가능 사용가능 사용가능 사용가능 사용가능 사용가능 사용가능 사용가능 사용가능 사용가능 사용가능 사용가능 사용가능
[CSS] clip clip clip 속성은 보이는 영역을 설정합니다. clip clip 속성은 보이는 영역을 설정합니다. 특징 설명 기본 값 clip : auto 적용 - 버전 CSS2 정의(Definition) clip 속성은 절대 요소의 위치 값을 지정합니다. clip 속성은 position 요소와 같이 사용합니다. clip 속성은 웹 표준에서 삭제되어 현재는 사용하지 않습니다. 문법(Syntax) clip : auto | shape 속성(Property) 속성값 설명 auto clip의 기본값(auto)으로 설정합니다. shape clip을 설정을 shape를 통해 설정합니다.. 호환성(Compatibility) 6 7 8 9 10 11 clip 사용가능 사용가능 사용가능 사용가능 사용가능 사용안됨 사용안됨 사용가능..
[CSS] clear clear clear 속성은 float 요소의 성질을 차단합니다. clear clear 속성은 float 요소의 성질을 차단합니다. 특징 설명 기본 값 clear : none 적용 table 버전 CSS3 정의(Definition) clear 속성은 float 요소의 성질을 차단합니다. 문법(Syntax) clear: none | left | right | both 속성(Property) 속성값 설명 none clear를 적용하지 않습니다. left 왼쪽 요소에 성질을 차단합니다. right 오른쪽 요소에 성질을 차단합니다. both 양쪽 요소에 성질을 차단합니다. 호환성(Compatibility) 6 7 8 9 10 11 clear 사용가능 사용가능 사용가능 사용가능 사용가능 사용가능 사용가능 사용가능..
[CSS] caret-color caret-color caret-color 속성은 input의 커서 색을 정의합니다. caret-color caret-color 속성은 input의 커서 색을 정의합니다. 특징 설명 기본 값 caret-color : auto 적용 table 버전 CSS3 정의(Definition) caret-color 속성은 input의 커서 색을 정의합니다. 문법(Syntax) caret-color: auto | color; 속성(Property) 속성값 설명 auto 현재 커서 색을 사용합니다.(기본값) color 커서 색을 설정합니다. 호환성(Compatibility) 6 7 8 9 10 11 caret-color 사용가능 사용가능 사용가능 사용가능 사용가능 사용안됨 사용안됨 사용안됨 사용안됨 사용안됨 사용안됨 사..
[CSS] caption-side caption-side caption-side 속성은 caption의 위치를 설정합니다. caption-side caption-side 속성은 caption의 위치를 설정합니다. 특징 설명 기본 값 caption-side : top 적용 table 버전 CSS3 정의(Definition) caption-side 속성은 caption의 위치를 설정합니다. 문법(Syntax) caption-side : top | bottom 속성(Property) 속성값 설명 top 테이블 caption의 위치를 위쪽(기본값)으로 설정합니다. bottom 테이블 caption의 위치를 아래쪽으로 설정합니다. 호환성(Compatibility) 6 7 8 9 10 11 caption-side 사용가능 사용가능 사용가능 사용가능..
[CSS] box-sizing box-sizing box-sizing 속성은 요소 크기에 패딩 포함 여부를 설정합니다. box-sizing box-sizing 속성은 요소 크기에 패딩 포함 여부를 설정합니다. 특징 설명 기본 값 box-sizing : content-box 적용 box 버전 CSS3 사용성 정의(Definition) box-sizing 속성은 요소 크기에 패딩 포함 여부를 설정합니다. 박스 요소의 width 값은 margin, padding, border 값을 포함하여 계산합니다. box-sizing: border-box로 설정할 경우 박스 요소의 width 값은 margin, border 값을 포함하여 계산합니다. padding 값은 제외됩니다. 문법(Syntax) box-sizing: content-box | bo..
[CSS] box-shadow box-shadow box-shadow 속성은 박스 요소의 그림자를 설정합니다. box-shadow box-shadow 속성은 박스 요소의 그림자를 설정합니다. 특징 설명 기본 값 box-shadow : none 적용 - 버전 CSS3 정의(Definition) box-shadow 속성은 박스 요소의 그림자를 설정합니다. 문법(Syntax) box-shadow : none | h-shadow | v-shadow | blur | spread | color | inset /* h-shadow | v-shadow | color를 설정한 경우 */ box-shadow: 10px 20px #ccc; /* h-shadow | v-shadow | blur | color를 설정한 경우 */ box-shadow: 10p..
[CSS] box-decoration-break box-decoration-break box-decoration-break 속성은 컬럼 및 줄바꿈시 테두리와 패딩의 방식을 설정합니다. box-decoration-break box-decoration-break 속성은 컬럼 및 줄바꿈시 테두리와 패딩의 방식을 설정합니다. 특징 설명 기본 값 box-decoration-break : slice 적용 - 버전 CSS3 정의(Definition) box-decoration-break 속성은 위치 요소의 아래쪽 속성을 설정합니다. 문법(Syntax) box-decoration-break: slice | clone 속성(Property) 속성값 설명 slice 하나의 테두리와 패딩이 모든 박스에 적용된다. clone 각각의 테두리 및 패딩이 독립적으로 적용된다. ..
[CSS] bottom bottom bottom 속성은 위치 요소의 아래쪽 속성을 설정합니다. bottom bottom 속성은 위치 요소의 아래쪽 속성을 설정합니다. 특징 설명 기본 값 bottom-width : medium bottom-style : none bottom-color : currentColor 적용 border 버전 CSS3 정의(Definition) bottom 속성은 위치 요소의 아래쪽 속성을 설정합니다. 문법(Syntax) bottom : auto | length 속성(Property) 속성값 설명 auto 요소의 아래쪽 값을 자동(기본)으로 설정합니다. length 요소의 아래쪽 값을 CSS 단위를 통해 설정합니다. percentage 요소의 아래쪽 값을 %로 설정합니다. 호환성(Compatibility..
[CSS] border-width border-width border-width 속성은 테두리 두께 속성을 설정합니다. border-width border-width 속성은 테두리 두께 속성을 설정합니다. 특징 설명 기본 값 border-width-width : medium border-width-style : none border-width-color : currentColor 적용 border 버전 CSS3 사용성 정의(Definition) border-width 속성은 테두리 두께 속성을 설정합니다. 비교(Compare) border-top-width 속성은 테두리 위쪽 두께 속성을 설정합니다. border-right-width 속성은 테두리 오른쪽 두께 속성을 설정합니다. border-bottom-width 속성은 테두리 아래쪽 ..
[CSS] border-top-width border-top-width border-top-width 속성은 테두리 위쪽 두께 속성을 설정합니다. border-top-width border-top-width 속성은 테두리 위쪽 두께 속성을 설정합니다. 특징 설명 기본 값 border-top-width : medium 적용 border 버전 CSS1 사용성 정의(Definition) border-top-width 속성은 테두리 위쪽 두께 속성을 설정합니다. 비교(Compare) border-top-width 속성은 테두리 위쪽 두께 속성을 설정합니다. border-right-width 속성은 테두리 오른쪽 두께 속성을 설정합니다. border-bottom-width 속성은 테두리 아래쪽 두께 속성을 설정합니다. border-left-width 속..
[CSS] border-top-style border-top-style border-top-style 속성은 테두리 위쪽 스타일 속성을 설정합니다. border-top-style border-top-style 속성은 테두리 위쪽 스타일 속성을 설정합니다. 특징 설명 기본 값 border-top-style : none 적용 border 버전 CSS1 사용성 정의(Definition) border-top-style 속성은 테두리 위쪽 스타일 속성을 설정합니다. 비교(Compare) border-top-style 속성은 테두리 위쪽 스타일 속성을 설정합니다. border-right-style 속성은 테두리 오른쪽 스타일 속성을 설정합니다. border-bottom-style 속성은 테두리 아래쪽 스타일 속성을 설정합니다. border-left-sty..
[CSS] border-top-right-radius border-top-right-radius border-top-right-radius 속성은 윗부분 오른쪽 모서리 굴곡을 설정합니다. border-top-right-radius border-top-right-radius 속성은 윗부분 오른쪽 모서리 굴곡을 설정합니다. 특징 설명 기본 값 border-top-right-radius : 0 적용 border 버전 CSS1 사용성 정의(Definition) border-top-right-radius 속성은 윗부분 오른쪽 모서리 굴곡을 설정합니다. 비교(Compare) border-radius 속성은 모서리 굴곡을 설정합니다. border-top-left-radius 속성은 윗부분 왼쪽 모서리 굴곡을 설정합니다. border-top-right-radius 속성은..
[CSS] border-top-left-radius border-top-left-radius border-top-left-radius 속성은 윗부분 왼쪽 모서리 굴곡을 설정합니다. border-top-left-radius border-top-left-radius 속성은 윗부분 왼쪽 모서리 굴곡을 설정합니다. 특징 설명 기본 값 border-top-left-radius : 0 적용 border 버전 CSS1 사용성 정의(Definition) border-top-left-radius 속성은 윗부분 왼쪽 모서리 굴곡을 설정합니다. 비교(Compare) border-radius 속성은 모서리 굴곡을 설정합니다. border-top-left-radius 속성은 윗부분 왼쪽 모서리 굴곡을 설정합니다. border-top-right-radius 속성은 윗부분 오른쪽 ..
[CSS] border-top-color border-top-color border-top-color 속성은 테두리 위쪽 색 속성을 설정합니다. border-top-color border-top-color 속성은 테두리 위쪽 색 속성을 설정합니다. 특징 설명 기본 값 border-top-color : currentColor 상속 안됨 애니메이션 가능 적용 border 버전 CSS3 사용성 정의(Definition) border-top-color 속성은 테두리 위쪽 색 속성을 설정합니다. 비교(Compare) border-top-color 속성은 테두리 위쪽 색 속성을 설정합니다. border-right-color 속성은 테두리 오른쪽 색 속성을 설정합니다. border-bottom-color 속성은 테두리 아래쪽 색 속성을 설정합니다. bord..
[CSS] border-top border-top border-top 속성은 테두리 위쪽 속성을 일괄적으로 설정합니다. border-top border-top 속성은 테두리 위쪽 속성을 일괄적으로 설정합니다. 특징 설명 기본 값 border-top-width : medium border-top-style : none border-top-color : currentColor 적용 border 버전 CSS3 사용성 정의(Definition) border-top 속성은 테두리 위쪽 속성을 일괄적으로 설정합니다. 비교(Compare) border-top 속성은 테두리 위쪽 속성을 일괄적으로 설정합니다. border-right 속성은 테두리 오른쪽 속성을 일괄적으로 설정합니다. border-bottom 속성은 테두리 아래쪽 속성을 일괄적으로 ..
[CSS] border-style border-style border-style 속성은 테두리 스타일 속성을 설정합니다. border-style border-style 속성은 테두리 스타일 속성을 설정합니다. 특징 설명 기본 값 border-top-style : none border-right-style : none border-bottom-style : none border-left-style : none 적용 border 버전 CSS2 사용성 정의(Definition) border-style 속성은 테두리 스타일 속성을 설정합니다. 비교(Compare) border-top-style는 속성은 테두리 위쪽 스타일 속성을 설정합니다. border-right-style는 속성은 테두리 오른쪽 스타일 속성을 설정합니다. border-bott..
1 ··· 3 4 5 6 7 8
Alphabet
Topic
Alphabet
Topic
Alphabet
Topics



Topics
Topics
Topics
Topics
Topics
Topics
Topics
Topics

티스토리툴바