목록CSS (178)
코드랩 레퍼런스
nav-index 속성은 메뉴의 순서 상태를 정의합니다. 특징 설명 기본 값 auto 상속 안됨 애니메이션 안됨 버전 CSS3 Definition nav-index 속성은 메뉴의 순서 상태를 정의합니다. Syntax nav-index : auto | number | inherit; Property 속성 값 설명 auto 기본값이며 nav의 요소 성질을 자동으로 설정합니다. number nav index를 숫자를 통해 설정합니다. inherit nav-up의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 nav-index
nav-down 속성은 메뉴의 아래 속성을 정의합니다. Summary 특징 설명 기본 값 auto 상속 안됨 애니메이션 안됨 버전 CSS3 Definition nav-down 속성은 메뉴의 아래 속성을 정의합니다. Syntax nav-down : auto | id | target-name | inherit; Property 속성 값 설명 auto 기본값이며 nav의 요소 성질을 자동으로 설정합니다. id nav 이동을 id를 통해 설정합니다. target-name nav 이동을 target-name을 통해 설정합니다. inherit nav-up의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 nav-down
min-width 속성은 요소의 최소 가로값을 설정합니다. Summary 특징 설명 기본 값 0 상속 안됨 애니메이션 가능 버전 CSS2 Definition min-width 속성은 요소의 최소 가로값을 설정합니다. Syntax min-width : length | inherit; Property 속성 값 설명 length 최소 width 값을 CSS 단위를 통해 설정합니다. % 최소 width 값을 %를 통해 설정합니다. inherit min-width의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 min-width Sample min-width min-width : 50px; min-width : 100px; min-width : 150px; min-widt..
min-height 속성은 요소의 최소 세로값을 설정합니다. Summary 특징 설명 기본 값 0 상속 안됨 애니메이션 가능 버전 CSS2 Definition min-height 속성은 요소의 최소 세로값을 설정합니다. Syntax min-height : length | inherit; Property 속성 값 설명 length 최소 width 값을 CSS 단위를 통해 설정합니다. % 최소 width 값을 %를 통해 설정합니다. inherit min-height의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 min-height Sample min-height min-height min-height min-height min-height min-height min..
max-width 속성은 요소의 최대 가로값을 설정합니다. Summary 특징 설명 기본 값 none 상속 안됨 애니메이션 안됨 버전 CSS2 Definition max-width 속성은 요소의 최대 가로값을 설정합니다. Syntax max-width: none | length | inherit; Property 속성 값 설명 none max-width 값을 적용하지 않습니다. length max-width 값을 CSS 단위를 통해 설정합니다. % max-width 값을 %를 통해 설정합니다. inherit max-width의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 max-width Sample max-width max-width : 100%; max-wi..
max-height 속성은 요소의 최대 세로값을 설정합니다. Summary 특징 설명 기본 값 auto 상속 안됨 애니메이션 가능 버전 CSS2 Definition max-height 속성은 요소의 최대 세로값을 설정합니다. Syntax max-height : none | length | inherit; Property 속성 값 설명 none max-height 값을 적용하지 않습니다. length max-height 값을 CSS 단위를 통해 설정합니다. % max-height 값을 %를 통해 설정합니다. inherit z-index의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 max-height Sample max-height max-height max-he..
margin-top 속성은 요소의 위쪽 바같쪽 여백을 설정합니다. Summary 특징 설명 기본 값 0 상속 안됨 애니메이션 가능 버전 CSS1 Definition margin-top 속성은 요소의 위쪽 바같쪽 여백을 설정합니다. Syntax margin-top : length | auto | inherit; Property 속성 값 설명 length 요소의 위쪽 바같쪽 여백을 CSS단위를 통해 설정합니다. % 요소의 위쪽 바같쪽 여백을 %를 통해 설정합니다. auto 요소의 위쪽 바같쪽 여백을 자동으로 설정합니다. inherit margin-top의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 margin-top Sample margin-top margin-t..
margin-right 속성은 요소의 오른쪽 바같쪽 여백을 설정합니다. Summary 특징 설명 기본 값 0 상속 안됨 애니메이션 가능 버전 CSS1 Definition margin-right 속성은 요소의 오른쪽 바같쪽 여백을 설정합니다. Syntax margin-right : length | auto | inherit; Property 속성 값 설명 length 요소의 오른쪽 바같쪽 여백을 CSS단위를 통해 설정합니다. % 요소의 오른쪽 바같쪽 여백을 %를 통해 설정합니다. auto 요소의 오른쪽 바같쪽 여백을 자동으로 설정합니다. inherit margin-right의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 margin-right Sample marg..
margin-left 속성은 요소의 왼쪽 바같쪽 여백을 설정합니다. Summary 특징 설명 기본 값 0 상속 안됨 애니메이션 가능 버전 CSS1 Definition margin-left 속성은 요소의 왼쪽 바같쪽 여백을 설정합니다. Syntax margin-left : length | auto | inherit; Property 속성 값 설명 length 요소의 왼쪽 바같쪽 여백을 CSS단위를 통해 설정합니다. % 요소의 왼쪽 바같쪽 여백을 %를 통해 설정합니다. auto 요소의 왼쪽 바같쪽 여백을 자동으로 설정합니다. inherit margin-left의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 margin-left Sample margin-left ma..
margin-bottom 속성은 블럭요소의 아래 바같쪽 여백을 설정합니다. Summary 특징 설명 기본 값 0 상속 안됨 애니메이션 가능 버전 CSS1 Definition margin-bottom 속성은 블럭요소의 아래 바같쪽 여백을 설정합니다. Syntax margin-bottom : length | auto | inherit; Property 속성 값 설명 length 요소의 아래쪽 바같쪽 여백을 CSS단위를 통해 설정합니다. % 요소의 아래쪽 바같쪽 여백을 %를 통해 설정합니다. auto 요소의 아래쪽 바같쪽 여백을 자동으로 설정합니다. inherit margin-bottom의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 margin-bottom Samp..
margin 속성은 요소의 바같쪽 여백을 설정합니다. Summary 특징 설명 기본 값 margin-top : 0; margin-right : 0; margin-bottom : 0; margin-left : 0; 상속 안됨 애니메이션 가능 버전 CSS1 Definition margin 속성은 요소의 바같쪽 여백을 설정합니다. margin-top 속성은 요소의 위쪽 바깥쪽 여백을 설정합니다. margin-right 속성은 요소의 오른쪽 바깥쪽을 설정합니다. margin-bottom 속성은 요소의 아래쪽 바깥 여백을 설정합니다. margin-left 속성은 요소의 왼쪽 바깥 여백을 설정합니다. Syntax margin : length | auto | inherit; Property 속성 값 설명 length..
list-style-type 속성은 목록 마커의 유형을 설정합니다. Summary 특징 설명 기본 값 disc 상속 가능 애니메이션 안됨 버전 CSS1 Definition list-style-type 속성은 목록 마커의 유형을 설정합니다. Syntax list-style-type : disc | armenian | circle | cjk-ideographic | decimal-leading-zero | georgian | hebrew | hiragana | hiragana-iroha | katakana | katakana-iroha | lower-alpha | lower-greek | lower-latin | lower-roman | none | square | upper-alpha | upper-lat..
list-style-position 속성은 목록 마커의 위치 속성을 설정합니다. Summary 특징 설명 기본 값 outside 상속 가능 애니메이션 안됨 버전 CSS1 Definition list-style-position 속성은 목록 마커의 위치 속성을 설정합니다. Syntax list-style-position : inside | outside | inherit; Property 속성 값 설명 inside 목록 마커의 위치를 안쪽으로 설정합니다. outside 목록 마커의 위치를 바깥쪽으로 설정합니다. inherit list-style-position의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 list-style-position Sample HTML이란..
list-style-image 속성은 목록 마커의 이미지를 설정합니다. Summary 특징 설명 기본 값 none 상속 가능 애니메이션 안됨 버전 CSS1 Definition list-style-image 속성은 목록 마커의 이미지를 설정합니다. Syntax list-style-image : none | url | inherit; Property 속성 값 설명 none 목록 마커 이미지를 표현하지 않습니다. url 목록 마커 이미지 경로를 설정합니다. inherit list-style-image의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 list-style-image Sample HTML이란? 웹페이지를 만들기 위한 언어 HT - HyperText, 문서와 ..
list-style 속성은 목록 스타일 속성을 설정합니다. Summary 특징 설명 기본 값 list-style-image : none; list-style-position : outside; list-style-type : disc 상속 가능 애니메이션 안됨 버전 CSS3 Definition list-style 속성은 목록 스타일 속성을 설정합니다. Syntax list-style : list-style-type | list-style-position | list-style-image | inherit; Property 속성 값 설명 list-style-type 목록 마커의 유형을 설정합니다. list-style-position 목록 마커의 위치를 설정합니다. list-style-image 목록 마커의..
line-height 속성은 문장과 문장 사이의 간격을 설정합니다. Summary 특징 설명 기본 값 normal 상속 가능 애니메이션 가능 버전 CSS1 Definition line-height 속성은 문장과 문장 사이의 간격을 설정합니다. Syntax line-height : normal | number | length | inherit; Property 속성 값 설명 normal 문장과 문장사이의 기본 간격입니다. number 문장과 문장사이의 간격을 숫자 배수만큼 설정합니다. length 문장과 문장사이의 간격을 CSS 단위로 설정합니다. percentage 문장과 문장사이의 간격을 %로 설정합니다. inherit line-height의 속성 값을 상위요소한테 상속받습니다. Compatibilit..
letter-spacing 속성은 글자 사이의 간격을 설정합니다. Summary 특징 설명 기본 값 normal 상속 가능 애니메이션 가능 버전 CSS1 Definition letter-spacing 속성은 글자 사이의 간격을 설정합니다. Syntax letter-spacing : normal | length | inherit; Property 속성 값 설명 normal letter-spacing의 기본적인 간격입니다. length 글자와 글자 사이의 간격을 설정합니다. inherit letter-spacing의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 letter-spacing Sample "The grid system is an aid, not a gua..
left 속성은 요소의 왼쪽 속성을 설정합니다. Summary 특징 설명 기본 값 auto 상속 안됨 애니메이션 가능 버전 CSS2 Definition left 속성은 요소의 왼쪽 속성을 설정합니다. Syntax left : auto | length | inherit; Property 속성 값 설명 auto 요소의 왼쪽 값을 자동(기본)으로 설정합니다. length 요소의 왼쪽 값을 CSS 단위를 통해 설정합니다. percentage 요소의 왼쪽 값을 %로 설정합니다. inherit left의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 left Sample top position : absolute; left : auto; position : absolute;..
justify-content 속성은 콘텐츠의 좌우 관계 정렬 상태를 정의합니다. Summary 특징 설명 기본 값 flex-start 상속 안됨 애니메이션 안됨 버전 CSS3 Definition justify-content 속성은 콘텐츠의 좌우 관계 정렬 상태를 정의합니다. justify-content 속성은 콘텐츠의 좌우 관계 정렬 상태를 정의하고 align-content 속성은 콘텐츠의 상하 관계 정렬 상태를 정의합니다. justify-content 속성은 display:flex; 상태에서 적용됩니다. Syntax justify-content : flex-start | flex-end | center | space-between | space-around | inherit; Property 속성 값 ..
height 속성은 콘텐츠 요소의 세로값을 설정합니다. Summary 특징 설명 기본 값 auto 상속 안됨 애니메이션 가능 버전 CSS1 Definition height 속성은 콘텐츠 요소의 세로값을 설정합니다. Syntax height : auto | length | inherit; Property 속성 값 설명 auto 요소의 세로값을 자동(기본)으로 설정합니다. length 요소의 세로값을 CSS 단위를 통해 설정합니다. percentage 요소의 세로값을 %로 설정합니다. inherit height의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 font-weight Sample height height : 280px; height : 380px; hei..
hanging-punctuation 속성은 글씨의 시작 및 끝의 위치 정의합니다. Summary 특징 설명 기본 값 none 상속 가능 애니메이션 안됨 버전 CSS3 Definition hanging-punctuation 속성은 글씨의 시작 및 끝의 위치 정의합니다. Syntax hanging-punctuation : none | first | last | allow-end | force-end | inherit; Property 속성 값 설명 none 글자의 간격을 적용(기본 값)하지 않습니다. first 글자의 간격을 처음을 기준으로 설정합니다. last 글자의 간격을 마지막을 기준으로 설정합니다. allow-end 글자의 간격을 글자에 기준으로 설정합니다. force-end 글자의 간격을 마지막 글..
font-weight 속성은 글꼴 두께를 정의합니다. Summary 특징 설명 기본 값 normal 상속 가능 애니메이션 가능 버전 CSS1 Definition font-weight 속성은 글꼴 두께를 정의합니다. font-weight 속성은 폰트 자체가 두께를 지원하지 않으면, 세부적인 두께는 표시되지 않을 수 있습니다. Syntax font-weight : normal | bold | bolder | lighter | number | inherit; Property 속성 값 설명 normal 폰트 두께를 normal(기본값) 설정합니다. bold 폰트 두께를 bold로 설정합니다. bolder 폰트 두께를 bolder로 설정합니다. lighter 폰트 두께를 lighter로 설정합니다. number ..
font-variant 속성은 글꼴을 변형을 정의합니다. Summary 특징 설명 기본 값 normal 상속 가능 애니메이션 안됨 버전 CSS1 Definition font-variant 속성은 글꼴을 변형을 정의합니다. font-variant 속성은 영어만 적용됩니다. Syntax font-variant : normal | small-caps | inherit; Property 속성 값 설명 normal 텍스트의 기본값을 설정합니다. small-caps 영문 소문자를 작은 대문자로 변경합니다. inherit font-variant의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 font-variant Sample "The grid system is an aid,..
font-style 속성은 폰트의 스타일을 정의합니다. Summary 특징 설명 기본 값 normal 상속 가능 애니메이션 안됨 버전 CSS1 Definition font-style 속성은 폰트의 스타일을 정의합니다. Syntax font-style : normal | italic | oblique | inherit; Property 속성 값 설명 normal 폰트 스타일을 기본값으로 설정합니다. italic 폰트 스타일을 italic으로 설정합니다. oblique 폰트 스타일을 oblique으로 설정합니다. inherit font-style의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 font-style Sample "The grid system is an ..
font-stretch 속성은 글자의 크기를 정의합니다. Summary 특징 설명 기본 값 normal 상속 가능 애니메이션 가능 버전 CSS3 Definition font-stretch 속성은 글자의 크기를 정의합니다. Syntax font-stretch : ultra-condensed | extra-condensed | condensed | semi-condensed | normal | semi-expanded | expanded | extra-expanded | ultra-expanded | inherit; Property 속성 값 설명 ultra-condensed 글자의 크기를 ultra-condensed로 설정합니다. extra-condensed 글자의 크기를 extra-condensed로 설정..
font-size-adjust 속성은 소문자를 기준으로 폰트 크기를 설정합니다. Summary 특징 설명 기본 값 none 상속 가능 애니메이션 가능 버전 CSS3 Definition font-size-adjust 속성은 소문자를 기준으로 폰트 크기를 설정합니다. 폰트 크기는 대문자를 기준으로 측정이 되지만 CSS3에서 추가된 font-size-adjust 소문자를 기준으로 폰트 크기를 설정 할 수 있습니다. Syntax font-size-adjust : number | none | inherit; Property 속성 값 설명 number 소문자 크기를 기준으로 number를 설정합니다. none font-size-adjust를 설정하지 않습니다. inherit font-size-adjust의 속성 값..
font-size 속성은 폰트 사이즈 속성을 설정합니다. Summary 특징 설명 기본 값 medium 상속 가능 애니메이션 가능 버전 CSS1 Definition font-size 속성은 폰트 사이즈 속성을 설정합니다. Syntax font-size : medium | xx-small | x-small | small | large|x-large | xx-large | smaller | larger | length | inherit; Property 속성 값 설명 xx-small 폰트 크기를 xx-small로 설정합니다. x-small 폰트 크기를 x-small로 설정합니다. small 폰트 크기를 small로 설정합니다. xx-large 폰트 크기를 xx-large로 설정합니다. x-large 폰트 크..
font-family 속성은 폰트 종류를 설정합니다. Summary 특징 설명 기본 값 브라우저 설정에 따라 다름 상속 가능 애니메이션 안됨 버전 CSS1 Definition font-family 속성은 폰트 종류를 설정합니다. 사용자 컴퓨터에 서체가 설치돼 있어야 서체가 브라우저에 표현됩니다. 폰트가 없을 경우를 대비해 쉼표(,)를 통해 여러개의 폰트를 설정가능합니다. 폰트명이 한글이거나 여러 단어인 경우는 큰따옴표("")를 설정해야 합니다. Syntax font-family : font | inherit; Property 속성 값 설명 font 폰트 종류를 설정합니다. inherit font-family의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 font..
font 속성은 폰트 스타일, 폰트 변형, 폰트 두께, 폰트 사이즈, 폰트 간격, 폰트 종류를 설정합니다. Summary 특징 설명 기본 값 font-style : normal font-variant : normal font-weight : normal font-size : medium line-height : normal font-family : 사용자 설정에 따름 상속 가능 애니메이션 font-style : 안됨 font-variant : 안됨 font-weight : 가능 font-size : 가능 line-height : 가능 font-family : 안됨 버전 CSS1 Definition font 속성은 폰트 스타일, 폰트 변형, 폰트 두께, 폰트 사이즈, 폰트 간격, 폰트 종류를 설정합니다. ..
float 속성은 블록요소의 정렬 상태를 설정합니다. Summary 특징 설명 기본 값 none 상속 안됨 애니메이션 안됨 버전 CSS1 Definition float 속성은 블록요소의 정렬 상태를 설정합니다. Syntax float : none | left | right | inherit; Property 속성 값 설명 none float의 성질을 적용하지 않습니다. left 블록요소를 왼쪽으로 정렬합니다. right 블록요소를 오른쪽으로 정렬합니다. inherit float의 속성 값을 상위요소한테 상속받습니다. Compatibility 6 7 8 9 10 11 float Sample float float float float float : none; float : left; float : right;