
CSS(层叠样式表)具有丰富的属性,以下是对一些主要属性的功能说明。
A
accent-color | 指定用户界面控件的主题色 |
align-content | 指定当项目未使用所有可用空间时,灵活容器内各行之间的对齐方式 |
align-items | 指定灵活容器内项的对齐方式 |
align-self | 指定灵活容器内选定项的对齐方式 |
all | 重置所有属性(Unicode-bidi 和方向除外) |
animation | 所有 animation-* 属性的速记属性 |
animation-delay | 指定动画开始的延迟 |
animation-direction | 指定动画是向前、向后还是交替循环播放 |
animation-duration | 指定动画完成一个周期所需的时间 |
animation-fill-mode | 指定动画未播放时元素的样式(动画开始之前、结束之后或两者兼而有之) |
animation-iteration-count | 指定应播放动画的次数 |
animation-name | 指定@keyframes动画的名称 |
animation-play-state | 指定动画是正在运行还是暂停 |
animation-timing-function | 指定动画的速度曲线 |
aspect-ratio | 指定元素的首选纵横比 |
B
backdrop-filter | 定义元素后面区域的图形效果 |
backface-visibility | 定义面向用户时元素的背面是否应可见 |
background | 所有background -* 属性的速记属性 |
background-attachment | 设置背景图像是随页面的其余部分一起滚动还是固定 |
background-blend-mode | 指定每个背景图层(颜色/图像)的混合模式 |
background-clip | 定义背景(颜色或图像)在元素内应延伸多远 |
background-color | 指定元素的背景色 |
background-image | 为元素指定一个或多个背景图像 |
background-origin | 指定背景图像的原点位置 |
background-position | 指定背景图像的位置 |
background-position-x | 指定背景图像在 x 轴上的位置 |
background-position-y | 指定背景图像在 y 轴上的位置 |
background-repeat | 设置是否/如何重复背景图像 |
background-size | 指定背景图像的大小 |
block-size | 指定元素在块方向上的大小 |
border | border-width, border-style, border-color的简写属性 |
border-block | 边框块宽度、边框块样式和边框块颜色的简写属性 |
border-block-color | 设置块方向上开始和结束处边框的颜色 |
border-block-end-color | 设置块方向末端边框的颜色 |
border-block-end-style | 设置块方向末端边框的样式 |
border-block-end-width | 设置块方向末端边框的宽度 |
border-block-start-color | 在块方向上设置开头边框的颜色 |
border-block-start-style | 在块方向的开头设置边框的样式 |
border-block-start-width | 设置块方向上开头边框的宽度 |
border-block-style | 设置块方向上开始和结束处边框的样式 |
border-block-width | 设置块方向上开始和结束处边框的宽度 |
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-inline | border-inline-width, border-inline-style, border-inline-color的简写属性 |
border-inline-color | 设置沿内联方向开始和结束的边框颜色 |
border-inline-end-color | 在内联方向上设置末端边框的颜色 |
border-inline-end-style | 在内联方向上设置边框末尾的样式 |
border-inline-end-width | 设置边框末端沿内联方向的宽度 |
border-inline-start-color | 在嵌入方向上设置开头边框的颜色 |
border-inline-start-style | 在嵌入方向上设置开头边框的样式 |
border-inline-start-width | 设置开头沿内联方向的边框宽度 |
border-inline-style | 设置沿内联方向开始和结束的边框样式 |
border-inline-width | 设置沿内联方向开始和结束的边框宽度 |
border-left | 所有border-left-* 属性的简写属性 |
border-left-color | 设置左边框的颜色 |
border-left-style | 设置左边框的样式 |
border-left-width | 设置左边框的宽度 |
border-radius | 四个border-*-radius属性的简写属性 |
border-right | 所有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-decoration-break | 设置元素的背景和边框在分页符处的行为,或者对于内联元素,设置换行符处的背景和边框的行为。 |
box-reflect | 框反射属性用于创建元素的反射。 |
box-shadow | 将一个或多个阴影附加到元素 |
box-sizing | 定义如何计算元素的宽度和高度:它们是否应包括填充和边框 |
break-after | 指定是否应在指定元素之后出现分页符、列分隔符或区域分隔符 |
break-before | 指定是否应在指定元素之前出现分页符、列分隔符或区域分隔符 |
break-inside | 指定是否应在指定元素内出现分页符、列分隔符或区域分隔符 |
C
caption-side | 指定表格标题的位置 |
caret-color | 指定输入、文本区域或任何可编辑元素中光标(插入符号)的颜色 |
@charset | 指定样式表中使用的字符编码 |
clear | 指定浮动元素旁边的元素应执行的操作 |
clip | 剪切绝对定位的元素 |
color | 设置文本的颜色 |
column-count | 指定元素应划分为的列数 |
column-fill | 指定如何填充列,无论是否平衡 |
column-gap | 指定列之间的间距 |
column-rule | 所有column-rule-* 属性的简写属性 |
column-rule-color | 指定列间规则的颜色 |
column-rule-style | 指定列间规则的样式 |
column-rule-width | 指定列之间的规则宽度 |
column-span | 指定元素应跨越的列数 |
column-width | 指定列宽 |
columns | column-width和column-count的速记属性 |
content | 与 :before 和 :after 伪元素一起使用,以插入生成的内容 |
counter-increment | 增加或减少一个或多个 CSS 计数器的值 |
counter-reset | 创建或重置一个或多个 CSS 计数器 |
cursor | 指定指向元素时要显示的鼠标光标 |
D
direction | 指定文本方向/书写方向 |
display | 指定应如何显示某个HTML元素 |
E
empty-cells | 指定是否在表格中的空单元格上显示边框和背景 |
F
filter | 在元素显示之前定义元素上的效果(例如模糊或颜色偏移) |
flex | 弹性增长、弹性收缩和弹性基础属性的简写属性 |
flex-basis | 指定弹性项的初始长度 |
flex-direction | 指定灵活项目的方向 |
flex-flow | 挠flex-direction和flex-wrap属性的简写属性 |
flex-grow | 指定项目相对于其余项目的增长量 |
flex-shrink | 指定项目相对于其余项目的收缩方式 |
flex-wrap | 指定弹性项目是否应换行 |
float | 指定元素是否应向左、向右浮动或根本不浮动 |
font | font-style, font-variant, font-weight, font-size/line-height, font-family属性的速记属性 |
@font-face | 允许网站下载和使用“网页安全”字体以外的字体的规则 |
font-family | 指定文本的字体系列 |
font-feature-settings | 允许控制 OpenType 字体中的高级排版功能 |
@font-feature-values | 允许作者在 OpenType 中以不同的方式激活功能的字体-变体-替代中使用通用名称 |
font-kerning | 控制字距调整信息的使用(字母间距) |
font-language-override | 控制字体中特定于语言的字形的使用 |
font-size | 指定文本的字体大小 |
font-size-adjust | 在发生字体回退时保留文本的可读性 |
font-stretch | 从字体系列中选择普通、压缩或扩展的字体 |
font-style | 指定文本的字体样式 |
font-synthesis | 浏览器可以合成哪些缺少的字体(粗体或斜体)的控件 |
font-variant | 指定文本是否应以小型大写字体显示 |
font-variant-alternates | 控制与@font特征值中定义的备用名称关联的备用字形的使用 |
font-variant-caps | 控制大写字母的替代字形的使用 |
font-variant-east-asian | 控制东亚文字(例如日语和中文)的替代字形的使用 |
font-variant-ligatures | 控制在所应用的元素的文本内容中使用哪些连字和上下文形式 |
font-variant-numeric | 控制数字、分数和序号标记的备用字形的使用 |
font-variant-position | 控制相对于字体基线定位为上标或下标的较小大小的替代字形的使用 |
font-weight | 指定字体的粗细 |
G
gap | 行间距和列间距属性的简写属性 |
grid | grid-template-rows, grid-template-columns, grid-template-areas, grid-auto-rows, grid-auto-columns, grid-auto-flow属性的简写属性 |
grid-area | 指定网格项的名称,或者此属性是grid-row-start, grid-column-start, grid-row-end, grid-column-end属性的简写属性 |
grid-auto-columns | 指定默认列大小 |
grid-auto-flow | 指定如何在网格中插入自动放置的项目 |
grid-auto-rows | 指定默认行大小 |
grid-column | grid-column-start, grid-column-end属性的简写属性 |
grid-column-end | 指定网格项的结束位置 |
grid-column-gap | 指定列间间距的大小 |
grid-column-start | 指定网格项的开始位置 |
grid-gap | 网格行间距和网格列间隙属性的简写属性 |
grid-row | 网格行开始和网格行结束属性的简写属性 |
grid-row-end | 指定网格项的结束位置 |
grid-row-gap | 指定行间距的大小 |
grid-row-start | 指定网格项的开始位置 |
grid-template | grid-template-rows, grid-template-columns, grid-areas属性的速记属性 |
grid-template-areas | 指定如何使用命名网格项显示列和行 |
grid-template-columns | 指定列的大小以及网格布局中的列数 |
grid-template-rows | 指定网格布局中行的大小 |
H
hanging-punctuation | 指定是否可以将标点字符放在行框之外 |
height | 设置元素的高度 |
hyphens | 设置如何拆分单词以改进段落的布局 |
I
image-rendering | 指定用于图像缩放的算法类型 |
@import | 允许您将一个样式表导入到另一个样式表中 |
inline-size | 指定元素在内联方向上的大小 |
inset | 指定元素与父元素之间的距离 |
inset-block | 指定元素与父元素在块方向上的距离 |
inset-block-end | 指定元素末端与父元素在块方向上的距离 |
inset-block-start | 指定元素的起点与块方向上的父元素之间的距离 |
inset-inline | 指定元素与父元素之间在内联方向上的距离 |
inset-inline-end | 指定元素末端与父元素之间的内联方向距离 |
inset-inline-start | 指定元素的起点与内联方向上的父元素之间的距离 |
isolation | 定义元素是否必须创建新的堆叠内容 |
J
justify-content | 指定当项目未使用所有可用空间时,灵活容器内项目之间的对齐方式 |
justify-items | 在网格容器上设置。指定网格项在内联方向上的对齐方式 |
justify-self | 在网格项上设置。指定网格项在内联方向上的对齐方式 |
K
L
left | 指定定位元素的左侧位置 |
letter-spacing | 增加或减少文本中字符之间的间距 |
line-break | 指定如何/是否换行 |
line-height | 设置行高 |
line-style | 在一个声明中设置列表的所有属性 |
line-style-image | 将图像指定为列表项标记 |
line-style-position | 指定列表项标记(项目符号点)的位置 |
line-style-type | 指定列表项标记的类型 |
M
margin | 在一个声明中设置所有边距属性 |
margin-block | 指定块方向上的边距 |
margin-block-end | 指定块方向末端的边距 |
margin-block-start | 指定块方向上起始处的边距 |
margin-bottom | 设置元素的下边距 |
margin-inline | 指定内联方向的边距 |
margin-inline-end | 指定内联方向末尾的边距 |
margin-inline-start | 指定内联方向开头的边距 |
margin-left | 设置元素的左边距 |
margin-right | 设置元素的右边距 |
margin-top | 设置元素的上边距 |
mask | 通过遮罩或剪切特定位置的图像来隐藏元素的某些部分 |
mask-clip | 指定遮罩区域 |
mask-composite | 表示在当前遮罩层及其下方的遮罩层上使用的合成操作 |
mask-image | 指定要用作元素遮罩层的图像 |
mask-mode | 指定是将蒙版层图像视为亮度蒙版还是 Alpha 蒙版 |
mask-origin | 指定遮罩层图像的原点位置(遮罩位置区域) |
mask-position | 设置蒙版层图像的起始位置(相对于蒙版位置区域) |
mask-repeat | 指定如何重复遮罩层图像 |
mask-size | 指定遮罩层图像的大小 |
mask-type | 指定是将 SVG <蒙版> 元素视为亮度蒙版还是 Alpha 蒙版 |
max-height | 设置元素的最大高度 |
max-width | 设置元素的最大宽度 |
@media | 为不同的媒体类型/设备/大小设置样式规则 |
max-block-size | 设置元素在块方向上的最大大小 |
max-inline-size | 设置元素在内联方向上的最大大小 |
min-block-size | 设置元素在块方向上的最小大小 |
min-inline-size | 在内联方向上设置元素的最小大小 |
min-height | 设置元素的最小高度 |
min-width | 设置元素的最小宽度 |
min-blend-mode | 指定元素的内容应如何与其直接父背景混合 |
O
object-fit | 指定替换元素的内容应如何适应由其使用的高度和宽度建立的框 |
object-position | 指定被替换元素在其框内的对齐方式 |
offset | 是一种速记,指定如何沿路径对元素进行动画处理 |
offset-anchor | 指定元素上的一个点,该点固定到沿其进行动画处理的路径 |
offset-distance | 指定沿放置动画元素的路径的位置 |
offset-path | 指定元素沿其进行动画处理的路径 |
offset-rotate | 指定沿路径对元素进行动画处理时的元素旋转 |
opacity | 设置元素的不透明度级别 |
order | 设置灵活项相对于其余项的顺序 |
orphans | 设置必须在页面或列底部保留的最小行数 |
outline | outline-width, outline-style, outline-color属性的简写属性 |
outline-color | 设置轮廓的颜色 |
outline-offset | 偏移轮廓,并将其绘制到超出边框边缘 |
outline-style | 设置轮廓的样式 |
outline-width | 设置轮廓的宽度 |
overflow | 指定当内容溢出元素的框时发生的情况 |
overflow-anchor | 指定在上面加载新内容时,是否应向下推送可滚动附件中可视区域中的内容 |
overflow-wrap | 指定浏览器是否可以在长单词溢出容器时换行 |
overflow-x | 指定是否剪裁内容的左/右边缘(如果内容溢出元素的内容区域) |
overflow-y | 指定如果内容溢出元素的内容区域,是否剪裁内容的上/下边缘 |
overscroll-behavior | 指定是在 x 和 y 方向上提供滚动链接还是过度滚动 |
overscroll-behavior-block | 指定在块方向上是滚动链接还是过度滚动 |
overscroll-behavior-inline | 指定是具有内联方向的滚动链接还是过度滚动提示 |
overscroll-behavior-x | 指定是在 x 方向上滚动链接还是过度滚动提示 |
overscroll-behavior-y | 指定在 y 方向上是滚动链接还是过度滚动提示 |
P
padding | 所有填充 * 属性的速记属性 |
padding-block | 指定块方向上的填充 |
padding-block-end | 指定块方向末尾的填充 |
padding-block-start | 指定块方向上开头的填充 |
padding-bottom | 设置元素的底部填充 |
padding-inline | 指定内联方向上的填充 |
padding-inline-end | 指定内联方向末尾的填充 |
padding-inline-start | 指定内联方向开头的填充 |
padding-left | 设置元素的左边距 |
padding-right | 设置元素的右边距 |
padding-top | 设置元素的顶部填充 |
page-break-after | 设置元素后的分页行为 |
page-break-before | 设置元素前的分页符行为 |
page-break-inside | 设置元素内的分页行为 |
paint-order | 设置 SVG 元素或文本的绘制顺序。 |
perspective | 为 3D 定位的元素提供一些视角 |
perspective-origin | 定义用户查看 3D 定位元素的位置 |
place-content | 指定弹性框和网格布局的对齐内容和两端对齐内容属性值 |
place-items | 指定网格布局的对齐项和两端对齐项属性值 |
place-self | 指定网格布局的对齐和对齐自身属性值 |
pointer-events | 定义元素是否对指针事件做出反应 |
position | 指定用于元素的定位方法的类型(静态、相对、绝对或固定) |
Q
R
resize | 定义用户是否(以及如何)调整元素大小 |
right | 指定定位元素的正确位置 |
rotate | 指定元素的旋转 |
row-gap | 指定网格行之间的间距 |
S
scale | 通过放大或缩小来指定元素的大小 |
scroll-behavior | 指定是否平滑地对可滚动框中的滚动位置进行动画处理,而不是直线跳转 |
scroll-margin | 指定对齐位置和容器之间的边距 |
scroll-margin-block | 指定对齐位置与块方向上的容器之间的边距 |
scroll-margin-block-end | 指定对齐位置与块方向上的容器之间的结束边距 |
scroll-margin-block-start | 指定对齐位置与块方向上的容器之间的起始边距 |
scroll-margin-bottom | 指定底部对齐位置与容器之间的边距 |
scroll-margin-inline | 指定对齐位置与容器在内联方向上的边距 |
scroll-margin-inline-end | 指定对齐位置与嵌入方向上的容器之间的结束边距 |
scroll-margin-inline-start | 指定对齐位置与容器之间的内联方向的起始边距 |
scroll-margin-left | 指定左侧对齐位置与容器之间的边距 |
scroll-margin-right | 指定右侧对齐位置与容器之间的边距 |
scroll-margin-top | 指定顶部对齐位置与容器之间的边距 |
scroll-padding | 指定从容器到子元素上的对齐位置的距离 |
scroll-padding-block | 指定从容器到子元素上的对齐位置的块方向距离 |
scroll-padding-block-end | 指定从容器末端到子元素上的捕捉位置的块方向距离 |
scroll-padding-block-start | 指定从容器起点到子元素上的捕捉位置的块方向距离 |
scroll-padding-bottom | 指定从容器底部到子元素上的对齐位置的距离 |
scroll-padding-inline | 指定从容器到子元素上的对齐位置的内联方向距离 |
scroll-padding-inline-end | 指定从容器末端到子元素上的对齐位置的内联方向距离 |
scroll-padding-inline-start | 指定从容器起点到子元素上的对齐位置的内联方向距离 |
scroll-padding-left | 指定从容器左侧到子元素上的对齐位置的距离 |
scroll-padding-right | 指定从容器右侧到子元素上的对齐位置的距离 |
scroll-padding-top | 指定从容器顶部到子元素上的对齐位置的距离 |
scroll-snap-align | 指定用户停止滚动时元素的位置 |
scroll-snap-stop | 指定在触控板或触摸屏上快速轻扫后的滚动行为 |
scroll-snap-type | 指定滚动时对齐行为应如何 |
scrollbar-color | 指定元素滚动条的颜色 |
T
tab-size | 指定制表符的宽度 |
table-layout | 定义用于对表单元格、行和列进行布局的算法 |
table-align | 指定文本的水平对齐方式 |
table-align-last | 描述当文本对齐为“两端对齐”时,块的最后一行或强制换行符之前的行如何对齐 |
table-combine-upright | 指定将多个字符组合到单个字符的空间中 |
table-decoration | 指定添加到文本的修饰 |
table-decoration-color | 指定文本修饰的颜色 |
table-decoration-line | 指定文本修饰中的线条类型 |
table-decoration-style | 指定文本修饰中线条的样式 |
table-decoration-thickness | 指定装饰线的粗细 |
text-emphasis | 对文本应用强调标记 |
text-indent | 指定文本块中第一行的缩进 |
text-justify | 指定当文本对齐为“两端对齐”时使用的对齐方法 |
text-orientation | 定义一行中字符的方向 |
text-overflow | 指定当文本溢出包含元素时应发生的情况 |
text-shadow | 向文本添加阴影 |
text-transform | 控制文本的大小写 |
text-underline-position | 指定使用文本修饰属性设置的下划线的位置 |
top | 指定已定位元素的顶部位置 |
transform | 将 2D 或 3D 变换应用于元素 |
transform-origin | 允许您更改转换元素上的位置 |
transform-style | 指定嵌套元素在 3D 空间中的呈现方式 |
transition | 所有transition-* 属性的速记属性 |
transition-delay | 指定过渡效果的开始时间 |
transition-duration | 指定完成过渡效果所需的秒数或毫秒数 |
transition-property | 指定过渡效果所针对的 CSS 属性的名称 |
transition-timing-function | 指定过渡效果的速度曲线 |
translate | 指定元素的位置 |
U
unicode-bidi | 与 direction 属性一起使用,以设置或返回是否应重写文本以支持同一文档中的多种语言 |
user-select | 指定是否可以选择元素的文本 |
V
vertical-align | 设置元素的垂直对齐方式 |
visibility | 指定元素是否可见 |
W
white-space | 指定如何处理元素内的空格 |
widows | 设置必须保留在页面或列顶部的最小行数 |
width | 设置元素的宽度 |
word-break | 指定单词到达行尾时应如何断开 |
word-spacing | 增加或减少文本中单词之间的间距 |
word-wrap | 允许将长而牢不可破的单词分解并换行到下一行 |
writing-mode | 指定文本行是水平布局还是垂直布局 |
Z
标签: css
版权声明:除非特别标注,否则均为本站原创文章,转载时请以链接形式注明文章出处。

还木有评论哦,快来抢沙发吧~