Latest web development tutorials
×

CSS 참조 설명서

CSS 참조 설명서 CSS 선택자 CSS 음성 참조 CSS Web 안전 글꼴 CSS 생기 CSS 단위 CSS 색 CSS 법률 색상 값 CSS 색 이름 CSS 16 진수 색상 값 CSS 브라우저 지원

CSS 재산

align-content align-items align-self all animation animation-delay animation-direction animation-duration animation-fill-mode animation-iteration-count animation-name animation-play-state animation-timing-function appearance backface-visibility background background-attachment background-blend-mode background-clip background-color background-image background-origin background-position background-repeat background-size border border-bottom border-bottom-color border-bottom-left-radius border-bottom-right-radius border-bottom-style border-bottom-width border-collapse border-color border-image border-image-outset border-image-repeat border-image-slice border-image-source border-image-width border-left border-left-color border-left-style border-left-width border-radius border-right border-right-color border-right-style border-right-width border-spacing border-style border-top border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width border-width bottom box-align box-direction box-flex box-flex-group box-lines box-ordinal-group box-orient box-pack box-shadow box-sizing caption-side clear clip color column-count column-fill column-gap column-rule column-rule-color column-rule-style column-rule-width column-span column-width columns content counter-increment counter-reset cursor direction display empty-cells filter flex flex-basis flex-direction flex-flow flex-grow flex-shrink flex-wrap float font @font-face font-family font-size font-size-adjust font-stretch font-style font-variant font-weight grid-columns grid-rows hanging-punctuation height icon justify-content @keyframes left letter-spacing line-height list-style list-style-image list-style-position list-style-type margin margin-bottom margin-left margin-right margin-top max-height max-width @media min-height min-width nav-down nav-index nav-left nav-right nav-up opacity order outline outline-color outline-offset outline-style outline-width overflow overflow-x overflow-y padding padding-bottom padding-left padding-right padding-top page-break-after page-break-before page-break-inside perspective perspective-origin position punctuation-trim quotes resize right rotation tab-size table-layout target target-name target-new target-position text-align text-align-last text-decoration text-decoration-color text-decoration-line text-decoration-style text-indent text-justify text-outline text-overflow text-shadow text-transform text-wrap top transform transform-origin transform-style transition transition-delay transition-duration transition-property transition-timing-function unicode-bidi vertical-align visibility white-space width word-break word-spacing word-wrap z-index

CSS 참조

주의 모든 주요 브라우저에서이 튜토리얼의 CSS 참조 테스트.


CSS 속성

CSS 속성 그룹 :

"CSS"열은 CSS 버전의 속성 (CSS1, CSS2, 또는 CSS3를) 정의를 나타냅니다.

애니메이션 속성

属性 描述 CSS
@keyframes 定义一个动画,@keyframes定义的动画名称用来被animation-name所使用。 3
animation 复合属性。检索或设置对象所应用的动画特效。 3
animation-name 检索或设置对象所应用的动画名称 ,必须与规则@keyframes配合使用,因为动画名称由@keyframes定义 3
animation-duration 检索或设置对象动画的持续时间 3
animation-timing-function 检索或设置对象动画的过渡类型 3
animation-delay 检索或设置对象动画的延迟时间 3
animation-iteration-count 检索或设置对象动画的循环次数 3
animation-direction 检索或设置对象动画在循环中是否反向运动 3
animation-play-state 检索或设置对象动画的状态 3

배경 등록

属性 描述 CSS
background 复合属性。设置对象的背景特性。 1
background-attachment 设置或检索背景图像是随对象内容滚动还是固定的。必须先指定background-image属性。 1
background-color 设置或检索对象的背景颜色。 1
background-image 设置或检索对象的背景图像。 1
background-position 设置或检索对象的背景图像位置。必须先指定background-image属性。 1
background-repeat 设置或检索对象的背景图像如何铺排填充。必须先指定background-image属性。 1
background-clip 指定对象的背景图像向外裁剪的区域。 3
background-origin S设置或检索对象的背景图像计算background-position时的参考原点(位置)。 3
background-size 检索或设置对象的背景图像的尺寸大小。 3

테두리 (테두리) 및 개요 (개요) 속성

属性 描述 CSS
border 复合属性。设置对象边框的特性。 1
border-bottom 复合属性。设置对象底部边框的特性。 1
border-bottom-color 设置或检索对象的底部边框颜色。 1
border-bottom-style 设置或检索对象的底部边框样式。 1
border-bottom-width 设置或检索对象的底部边框宽度。 1
border-color 置或检索对象的边框颜色。 1
border-left 复合属性。设置对象左边边框的特性。 1
border-left-color 设置或检索对象的左边边框颜色。 1
border-left-style 设置或检索对象的左边边框样式。 1
border-left-width 设置或检索对象的左边边框宽度。 1
border-right 复合属性。设置对象右边边框的特性。 1
border-right-color 设置或检索对象的右边边框颜色。 1
border-right-style 设置或检索对象的右边边框样式。 1
border-right-width 设置或检索对象的右边边框宽度。 1
border-style 设置或检索对象的边框样式。 1
border-top 复合属性。设置对象顶部边框的特性。 1
border-top-color 设置或检索对象的顶部边框颜色 1
border-top-style 设置或检索对象的顶部边框样式。 1
border-top-width 设置或检索对象的顶部边框宽度。 1
border-width 设置或检索对象的边框宽度。 1
outline 复合属性。设置或检索对象外的线条轮廓。 2
outline-color 设置或检索对象外的线条轮廓的颜色。 2
outline-style 设置或检索对象外的线条轮廓的样式。 2
outline-width 设置或检索对象外的线条轮廓的宽度。 2
border-bottom-left-radius 设置或检索对象的左下角圆角边框。提供2个参数,2个参数以空格分隔,每个参数允许设置1个参数值,第1个参数表示水平半径,第2个参数表示垂直半径,如第2个参数省略,则默认等于第1个参数 3
border-bottom-right-radius 设置或检索对象的右下角圆角边框。 3
border-image 设置或检索对象的边框样式使用图像来填充。 3
border-image-outset 规定边框图像超过边框的量。 3
border-image-repeat 规定图像边框是否应该被重复(repeated)、拉伸(stretched)或铺满(rounded)。 3
border-image-slice 规定图像边框的向内偏移。 3
border-image-source 规定要使用的图像,代替 border-style 属性中设置的边框样式。 3
border-image-width 规定图像边框的宽度。 3
border-radius 设置或检索对象使用圆角边框。 3
border-top-left-radius 定义左上角边框的形状。 3
border-top-right-radius 定义右下角边框的形状。 3
box-decoration-break 规定行内元素被折行 3
box-shadow 向方框添加一个或多个阴影。 3

상자 (상자) 속성

属性 描述 CSS
overflow-x 如果内容溢出了元素内容区域,是否对内容的左/右边缘进行裁剪。 3
overflow-y 如果内容溢出了元素内容区域,是否对内容的上/下边缘进行裁剪。 3
overflow-style 规定溢出元素的首选滚动方法。 3
rotation 围绕由 rotation-point 属性定义的点对元素进行旋转。 3
rotation-point 定义距离上左边框边缘的偏移点。 3

컬러 (컬러) 속성

属性 描述 CSS
color-profile 允许使用源的颜色配置文件的默认以外的规范 3
opacity 设置一个元素的透明度级别 3
rendering-intent 允许超过默认颜色配置文件渲染意向的其他规范 3

패딩 (패딩) 부동산

재산 설명 CSS
하나의 선언에서 모든 패딩 속성을 설정합니다 (1)
패딩 바닥 바닥 패딩 요소를 설정 (1)
패딩 왼쪽 왼쪽 패딩의 요소 (1)
패딩 오른쪽 요소는 바로 패딩을 설정 (1)
패딩 탑 상위 요소의 설정을 채우기 위해 (1)

미디어 속성 페이지의 콘텐츠

属性 说明 CSS
bookmark-label 指定书签的标签 3
bookmark-level 指定了书签级别 3
bookmark-target 指定了书签链接的目标 3
float-offset 在相反的方向推动浮动元素,他们一直具有浮动 3
hyphenate-after 指定一个断字的单词断字字符后的最少字符数 3
hyphenate-before 指定一个断字的单词断字字符前的最少字符数 3
hyphenate-character 指定了当一个断字发生时,要显示的字符串 3
hyphenate-lines 表示连续断字的行在元素的最大数目 3
hyphenate-resource 外部资源指定一个逗号分隔的列表,可以帮助确定浏览器的断字点 3
hyphens 设置如何分割单词以改善该段的布局 3
image-resolution 指定了正确的图像分辨率 3
marks 将crop and/or cross标志添加到文档 3
string-set   3

크기 (치수) 속성

属性 描述 CSS
height 设置元素的高度 1
max-height 设置元素的最大高度 2
max-width 设置元素的最大宽度 2
min-height 设置元素的最小高度 2
min-width 设置元素的最小宽度 2
width 设置元素的宽度 1

유연한 상자 모델 (유연한 박스) 등록 (신규)

属性 说明 CSS
flex 复合属性。设置或检索弹性盒模型对象的子元素如何分配空间。 3
flex-grow 设置或检索弹性盒的扩展比率。 3
flex-shrink 设置或检索弹性盒的收缩比率。 3
flex-basis 设置或检索弹性盒伸缩基准值。 3
flex-flow 复合属性。设置或检索弹性盒模型对象的子元素排列方式。 3
flex-direction 该属性通过定义flex容器的主轴方向来决定felx子项在flex容器中的位置。 3
flex-wrap 该属性控制flex容器是单行或者多行,同时横轴的方向决定了新行堆叠的方向。 3
align-content 在弹性容器内的各项没有占用交叉轴上所有可用的空间时对齐容器内的各项(垂直)。 3
align-items 定义flex子项在flex容器的当前行的侧轴(纵轴)方向上的对齐方式。 3
align-self 定义flex子项单独在侧轴(纵轴)方向上的对齐方式。 3
justify-content 设置或检索弹性盒子元素在主轴(横轴)方向上的对齐方式。 3
order 设置或检索弹性盒模型对象的子元素出现的順序。 3

유연한 상자 모델 (유연한 박스) 속성 (이전)

재산 설명 CSS
상자 정렬 하위 요소의 구성을 정렬하는 방식을 지정 3
상자 방향 지정되는 방향으로, 그 박스 자식 요소를 표시 3
상자 플렉스 하위 요소의 상자 유연한 또는 고정 크기 여부를 지정합니다 3
상자 플렉스 그룹 플렉스 그룹에 할당 유연한 요소 3
상자 라인 이 상위 프레임의 공간에서 실행될 때마다 다른 새로운 행할지 여부를 지정할 3
박스 서수 그룹 하위 요소의 프레임 표시 순서 3
상자의 방향 수평 또는 수직 방향의 하위 요소의 상자를 배치 할 것인지 여부를 지정 3
상자 팩 수평 위치에 측면 상자와 수직 프레임의 수직 위치를 지정합니다 3

글꼴 (폰트) 부동산

재산 설명 CSS
글꼴 하나의 선언에서 모든 글꼴 속성을 설정합니다 (1)
글꼴 - 가족 텍스트 폰트 패밀리의 규정 (1)
글꼴 크기 텍스트 글꼴 크기의 규정 (1)
글꼴 스타일 글꼴 스타일이 지정된 텍스트 (1)
글꼴 변형 글꼴 스타일이 지정된 텍스트 (1)
글꼴 무게 처방 글꼴 무게 (1)
@ 글꼴 얼굴 사이트가 다운로드 글꼴은 "웹 - 안전"이외 사용할 수 있도록 규칙 3
글꼴 크기 조정 요소 측면 소정의 값 3
글꼴 스트레칭 축소 또는 현재의 폰트 패밀리를 스트레칭 3

콘텐츠 생성 속성 (콘텐츠 속성을 생성)

재산 설명 CSS
함유량 로 : 전 : 의사 요소가 함께 사용 후에 생성 삽입 할 내용
카운터 증가 증가 또는 하나 이상의 카운터를 감소
카운터 리셋 하나 이상의 카운터를 만들거나 재설정
인용 부호 중첩 된 유형 참조 인용 세트
작물 대신 단지 전체 오브젝트의 직사각형 영역의 객체로 대체 요소를 허용 3
이동 -에 원소 흐름으로부터 제거 문서 나중 시점에서 다시 삽입되게 3
페이지 정책 문자열 값은 카운터에 의해 소정의 소자에 적용 할 페이지에 기초하여 결정된다 3

그리드 (그리드) 속성

재산 설명 CSS
그리드 열 표에서 각 컬럼의 폭을 지정합니다 3
그리드 행 그리드의 각 컬럼의 높이를 지정합니다 3

하이퍼 링크 (하이퍼 링크) 등록

재산 설명 CSS
목표 약식 속성은 대상 이름, 대상 - 새, 대상 위치 속성을 설정합니다 3
대상 이름 링크 (대상)을 엽니 지정 3
대상 - 새 새로운 타겟 링크가 기존 창에서 새 창 또는 열린 새 탭을 열고 여부를 지정합니다 3
대상 위치 새로운 목적지 링크 위치에 배치되어야 지정 3

와이어 프레임 (Linebox) 속성

재산 설명 CSS
정렬 조정 요소의보다 정확한 정렬을 할 수 있습니다 3
정렬-기준 어떻게 정렬하는 부모 요소에 지정된 인라인 수준 3
기준 시프트 지배적-기준에 지배적 인-기준 상대의 재배치를 할 수 있습니다 3
지배적 인-기준 스케일링 - 기본 테이블을 지정합니다 3
드롭 초기 후 조정 초기 정렬 포인트 풀다운 기본 연결 지점을 설정 3
드롭 초기 후-정렬 초기 라인은 주 연결 지점을 사용하여 상자 첫 글자를 갖는 것이다 내에 검량선 설정 3
드롭 초기 전에를 조정 설정 드롭 다운 보조 연결 지점 초기 정렬 포인트 3
드롭 초기 사전 정렬 초기 라인이 보조 배선함 첫 글자를 갖는 것이다 내에 검량선 설정 3
드롭 초기 크기 지역 침하의 제어의 첫 글자 3
드롭 초기 값 드롭 다운 초기 결과를 활성화 3
인라인 박스 정렬 정렬 된 전방 및 옆 인라인 요소를 갖는 다중 광고 인라인 블록 행을 설정 3
라인 스태킹 세트 라인 - 스택 - 전략, 라인 스태킹 - 루비, 및 라인 스태킹 시프트는 약식 속성 속성 3
라인 스태킹 - 루비 루비 주석 요소를 포함하는 블록 요소의 행 적층 방법을 설정 3
라인 스태킹 시프트 적층 블록 요소법 원소를 함유 집합베이스 시프트 라인 3
라인 - 스택 - 전략 스택 프레임의 블록 요소 내에 포함 된 메소드 세트 스태킹 3
텍스트 높이 텍스트 영역 인라인 박스 세트 블록 진행 치수 3

목록 (리스트) 등록

재산 설명 CSS
목록 스타일 하나의 선언에서 모든 속성의 목록을 설정 (1)
목록 스타일 이미지 목록 항목 마커로 그림 (1)
목록 스타일 위치 설정 목록 항목 마커 배치 (1)
목록 스타일 형 목록 항목 마커의 유형을 설정 (1)

여백 (여백) 속성

재산 설명 CSS
여유 하나의 선언에서 모든 여백 속성을 설정합니다 (1)
마진 - 하단 요소는 낮은 마진을 설정 (1)
마진 왼쪽 왼쪽 여백의 요소 (1)
마진 오른쪽 오른쪽 여백의 요소 (1)
여백 - 가기 요소는 여백에 설정 (1)

자막 (윤곽) 속성

재산 설명 CSS
움직이는 방향 콘텐츠 이동의 방향 설정 3
천막 플레이 카운트 몇 번하면 모바일 컨텐츠를 설정 한 3
움직이는 속도 얼마나 빨리 스크롤 내용을 설정 3
천막 스타일 스타일링 모바일 콘텐츠 3

여러 열 (다중 열) 속성

재산 설명 CSS
열 수 요소를 지정된 컬럼의 개수는으로 분할되어야 3
열 채우기 열을 채우는 방법을 지정합니다 3
열 간격 열 사이의 간격 지정 3
열 규칙 열 규칙 - * 속성 약식 속성에 대한 모든 설정 3
열 규칙 컬러 열 사이의 색상 규칙을 지정 3
열 규칙 스타일 스타일 규칙은 열 사이 지정 3
열 규칙 폭 열 사이 룰의 폭을 지정 3
열 스팬 지정된 요소가 걸쳐해야 얼마나 많은 열 3
열 폭 컬럼의 폭을 지정합니다 3
약식 속성은 열 및 열 너비의 수를 설정합니다 3

페이지 미디어 (페이지 된 미디어) 속성

재산 아가씨 CSS
적합 폭과 높이 속성이없는 경우 자동 방법 대규모 대체 요소의 힌트를 제공합니다 3
맞는 위치 상자 내부의 객체의 정렬을 결정 3
이미지 방향 오른쪽에 적합한 사용자 에이전트를 지정하거나 이미지를 시계 방향으로 회전 3
페이지 페이지를 표시해야 요소의 특정 유형을 지정합니다 3
크기 상자의 크기 및 방향을 포함하는 페이지의 내용을 지정 3

포지셔닝 (위치) 속성

재산 설명 CSS
바닥 테두리를 포함하는 요소를 대상으로 하단 여백 설정 사이의 국경에서 오프셋 블록
맑은 소정의 요소의 어떤면이 다른 부동 요소를 방지 (1)
클립 절대 위치 요소를 잘라
커서 유형 커서 조항이 표시 될 (모양)
디스플레이 유형 선택을 생성 할 수있는 요소를 명시 (1)
플로트 상자의 규정은 부유해야된다 (1)
좌회전 테두리를 포함하는 요소를 대상 설정은 여유 블록의 왼쪽 가장자리 사이의 오프셋 (offset) 왼쪽
오버 플로우
무엇 오버 플로우 상자 요소의 규정에의 할 때 내용을 발생
위치 위치 유형이 요소 지정
권리 오른쪽 여백 위치 오프셋 블록 경계를 포함하는 요소 사이의 오른쪽 테두리 설정
상단 블록 경계들 사이의 경계에 포함 된 요소와 여백 오프셋 타겟팅 설정
시계 눈에 보이는 요소의 규정은
Z- 인덱스 요소의 적층 순서 설정

페이징 (인쇄) 속성

재산 설명 CSS
고아 내부 요소가 페이지의 하단에 탭을 유지해야 할 경우의 최소 선 발생
페이지 나누기 - 후 설정 탭 행동 요소 후
페이지 나누기-전 설정 탭 행동 요소 전에
페이지 나누기 - 내부 탭 동작 내부 요소
과부 내부 요소가 페이지의 상단에 탭을 유지해야 할 경우의 최소 선 발생

루비 등록

재산 설명 CSS
루비 정렬 서로 루비와 루비 제어 텍스트 기반 콘텐츠 텍스트 정렬 기준 3
루비 오버행 텍스트 루비 루비베이스 폭을 초과 할 경우, 그 기재 이외에 허용되는 로컬 인접한 텍스트 루비 텍스트 마운트 결정 3
루비 위치 여기서는 기본 텍스트 루비 제어 3
루비 스팬 주석 요소의 동작을 제어 3

음성 (음성) 속성

재산 설명 CSS
설정 마크 전 마크 후 약식 속성 등록 3
마크 후 오디오 스트림에 이름 태그 허용 3
마크 전에 오디오 스트림에 이름 태그 허용 3
음소 그 음성 발음의 해당 요소의 텍스트가 포함 된 지정 3
휴식 설정 휴식을-전에 휴식 - 후 약식 속성 등록 3
나머지-후 지정된 마감 후 콘텐츠 요소는 휴식을 취하거나 운율 경계를 준수합니다 3
나머지-전 지정된 마무리하기 전에 콘텐츠 요소는 휴식을 취하거나 운율 경계를 준수합니다 3
음성 균형 지정된 밸런스 좌우 채널 3
음성 기간 선택된 요소의 내용을 지정의 길이를 렌더링하기 위해 취해 져야한다 3
음성 피치 평균 음성 피치 (주파수)를 지정합니다 3
음성 피치 범위 평균 피치 변화를 지정합니다 3
음성 속도 속도 제어 3
음성 스트레스 표시 노력 집중 3
음성 볼륨 음성 합성 즉, 출력 파형의 진폭 3

테이블 (표) 속성

재산 설명 CSS
국경 붕괴 테이블 테두리 합병 여부를 지정합니다
경계 간격 인접 셀 테두리 사이에 소정의 거리
캡션 측 타이틀 테이블의 소정 위치
빈 셀 빈 셀에 테두리와 배경 테이블을 표시할지 여부를 지정합니다
테이블 레이아웃 테이블 레이아웃 알고리즘을 설정

텍스트 (문자) 속성

재산 설명 CSS
텍스트의 색상을 설정합니다 (1)
방향 텍스트 소정의 방향 / 쓰기 방향
자간 설정 문자 간격 (1)
라인 높이 설정 행 높이 (1)
텍스트 정렬 텍스트의 규정의 수평 정렬 (1)
텍스트 장식 규정은 장식 효과의 텍스트에 추가 (1)
텍스트 들여 쓰기 텍스트 블록 들여 쓰기 첫 번째 줄의 규정 (1)
텍스트 변환 텍스트에 대한 민감한 컨트롤 (1)
유니 코드 - 양방향
수직 정렬 요소의 수직 배향 (1)
공백 빈 제어 요소를 설정하는 방법 (1)
단어 간격 단어 간격 설정 (1)
매달려 - 구두점 구두점이 줄 상자 이상으로 할 수 있는지 여부를 지정합니다 3
구두점 트림 구두점 표시를 제거할지 여부를 지정합니다 3
텍스트 정렬 - 마지막 텍스트 정렬은 마지막 행 배향을 정당화 설정되어 있으면. 3
텍스트 정당화 텍스트 정렬은 시간을 정당화하기 위해 설정 될 때 분산 방식 정렬을 지정. 3
텍스트 개요 개요 텍스트를 설정합니다. 3
텍스트 오버플로 요소는 텍스트가 포함 된 오버 플로우 때, 어떤 일이 일어날해야 지정 3
텍스트 그림자 텍스트에 그림자를 추가 3
텍스트 랩 규칙 텍스트 감싸기를 지정 3
워드 휴식 비 CJK 텍스트 줄 바꿈 규칙을 지정합니다 3
워드 랩 여부는 너무 오래 바꿈로 브라우저를 설정합니다. 3

2D / 3D 속성을 변환

재산 설명 CSS
변환 2D 또는 3D 변환 소자 적용 3
변환 - 기원 그것은 사용자가 변환 소자의 위치를 ​​변경할 수 있도록 3
변환 - 스타일 3D 공간에서는 중첩 된 요소를 지정 3
원근법 3 차원 요소를 지정하는 방법을 참조하십시오 사시도이다 3
관점 출처 3D 요소는 아래 위치를 지정 3
이면에는 시인성 요소의 정의를 볼 수 있는지 여부가 아니라 화면의 앞 3

전환 (전환) 속성

재산 설명 CSS
전이 이 속성은 전이 특성, 전이 기간, 전환 타이밍 기능, 전환 지연 축약 된 형태이다. 3
전이 특성 CSS 속성의 전환을 제공한다. 3
전이 시간 시간을 설정하는 수행 전환. 3
전환 타이밍 기능 실시 전환 타이밍 기능을 설정한다. 3
전환 지연 지정의 전환이 시작됩니다. 3

사용자의 외관 (사용자 인터페이스) 특성

재산 설명 CSS
외관 외부 스타일 정의 요소 3
상자 크기 조정 그것은 당신이 어떻게 든 특정 요소를 정의하는 지역을 적용 할 수 있습니다 3
아이콘 요소의 아이콘을 지정 3
탐색 다운 사용자가 아래쪽 탐색 키 아래쪽으로 위치를 누르면 지정 3
탐색 색인 탐색 (탭) 순서를 지정합니다. 3
탐색 왼쪽 사용자가 위치를 탐색하기 위해 왼쪽에있는 버튼을 누를 때 지정 3
탐색 오른쪽 탐색을 떠날 때 올바른 위치를 눌러 사용자를 지정합니다 3
탐색 업 사용자가 위치를 위쪽 키 탐색을 누르면 지정 3
- 개요 오프셋 (offset) 국경의 틀 밖에서 오프셋 윤곽 가장자리 설정 3
크기 조정 요소의 정의는 크기를 조정할 수 있는지 여부 3