缩写属性是可以让你同时设置其他几个 CSS 属性值的 CSS 属性。使用缩写属性,Web 开发人员可以编写更简洁、更具可读性的样式表,节省时间和精力。
css有哪些缩写属性?
1、background
background:在一个声明中设置所有的背景属性。
以下属性可采用任何顺序,且都是可选属性:
background-color
background-position
background-size
background-repeat
background-origin
content-box(默认)
border-box(设置width和height时包含内边距和边框)
background-clip
background-attachment
background-image
(顺便说一句,background-size设置百分数时,第一个数相对于父元素的width,第二个相对于父元素的height,如果只设置一个,第二个为auto)
2、border
border:在一个声明中设置所有的边框属性。
可设置的边框属性:
border-width:指定边框宽度
border-style:指定边框样式
border-color:指定边框颜色
顺序任意,除了border-style必须设置外,其余值可以省略为默认值。只能设置全局边框,可以用border-top、border-left等简写属性来覆盖修改局部
3、border-bottom
border-bottom:在一个声明中设置所有的下边框属性。
可设置的下边框属性:
border-bottom-width:指定底部边框宽度
border-bottom-style:指定底部边框样式
border-bottom-color:指定底部边框颜色
4、border-left
border-left:在一个声明中设置所有的左边框属性。
可设置的左边框属性:
border-left-width 规定左边框的宽度。
border-left-style 规定左边框的样式。
border-left-color 规定左边框的颜色。
5、border-right
border-right:在一个声明中设置所有的右边框属性。
可设置的右边框属性:
border-right-width 规定右边框的宽度。
border-right-style 规定右边框的样式。
border-right-color 规定右边框的颜色。
6、border-top
border-top:在一个声明中设置所有的上边框属性。
可设置的上边框属性:
border-top-width 规定上边框的宽度。
border-top-style 规定上边框的样式。
border-top-color 规定上边框的颜色。
7、outline
outline:在一个声明中设置所有的轮廓属性。
可设置的轮廓属性:
outline-color 规定边框的颜色。
outline-style 规定边框的样式。
outline-width 规定边框的宽度。
8、font
font:在一个声明中设置所有字体属性。
字体属性主要包括下面几个
font-style(字体样式):normal(正常)、italic(斜体)、oblique(倾斜);
font-variant (字体变化): normal(正常)、small-caps(小体大写字母);
font-weight (字体粗细):normal(正常)、bold(加粗)。有些浏览器甚至支持采用100到900之间的数字(以百为单位);
font-size(字体大小):可通过多种不同单位(比如像素或百分比等)来设置, 如:12px,12pt,120��1em;
font-family(字体类型):“Arial”、“Times New Roman”等;
如果用 font 属性的话,就可以把几个样式进行简化,减少书写的情况;font 属性的值应按以下次序书写(各个属性之间用空格隔开):
font:font-style | font-variant | font-weight | font-size/line-height | font-family
9、margin
margin:在一个声明中设置所有外边距属性。该属性可以有1到4个值。
示例:
margin:10px 5px 15px 20px;
上边距是 10px
右边距是 5px
下边距是 15px
左边距是 20px
margin:10px 5px 15px;
上边距是 10px
右边距和左边距是 5px
下边距是 15px
margin:10px 5px;
上边距和下边距是 10px
右边距和左边距是 5px
margin:10px;
所有四个边距都是 10px
10、padding
padding:在一个声明中设置所有内边距属性。该属性可以有1到4个值。
示例:
padding:10px 5px 15px 20px;
上填充是 10px
右填充是 5px
下填充是 15px
左填充是 20px
padding:10px 5px 15px;
上填充是 10px
右填充和左填充是 5px
下填充是 15px
padding:10px 5px;
上填充和下填充是 10px
右填充和左填充是 5px
padding:10px;
所有四个填充都是 10px
11、list-style
list-style:在一个声明中设置所有的列表属性。
可以设置的属性(按顺序):
list-style-type 设置列表项标记的类型。
list-style-position 设置在何处放置列表项标记。
list-style-image 使用图像来替换列表项的标记。
initial 将这个属性设置为默认值。
注:可以不设置其中的某个值,比如 "list-style:circle inside;" 也是允许的。未设置的属性会使用其默认值。
更多web开发知识,请查阅 HTML中文网 !!
以上就是css有哪些缩写属性?的详细内容,更多请关注易知道|edz.cc其它相关文章!