一、背景:背景支持为元素添加背景颜色和背景图片,接下里介绍背景相关的属性
1、Background-color:背景颜色,就是设置网页里的背景颜色的。
2、Background-image:用于设置背景图片。如果同时设置背景色(background-color)和背景图片(background-image),背景颜色会被背景图片覆盖。
3、Background-repeat:用于设置对象的背景图片是否平铺(重复显示).在使用属性之前,必须要指定背景图片(background-image)。属性repeat(纵横同时重复),no-repeat(不重复),repeat-x(x轴方向重复),repeat-y(y轴方向重复)4个值. 一般在网页中设置的都是no-repeat。
4、Background-position:用于控制图片的位置。Background-position有5个关键值分别是:top、left、botton、right、center。可以通过任意两个关键字组合来定位。也可以通过百分比来定位。例如:background-position:50% 50%。第一个百分比对应横坐标,第二个百分比对应纵坐标。
5、Background-attachment:设置背景图片是随对象内容滚动还是固定。在指定该属性之前,必须先指定背景图片。该属性两个值:scroll(默认) fixed(固定)。
6、Background:这是一个复合属性,可以同时设置背景颜色,背景图片,背景重复,背景位置等。
二、边框属性
7、宽度(border-width):可以使用thin,medium,thick等文本值,也可以使用除了百分比和负数之外的任何绝对值。
8、样式(border-style):有none(无边框),hidden(隐藏边框),dotted(点线边框),dashed(虚线边框),solid(实线边框),double(双线边框),groove(3D凹槽边框),ridge(3D凸槽边框),inset(3D入边框),outset(3D凸出边框)等文本值。
9、颜色(background-color):可以使用任何颜色值,包括RGB,HSL,十六进制颜色值和相关的关键字。
10、圆角边框:border-radius:属性用于指定圆角边框的圆角半径。
Border-top-left-radius:该属性用于指定左上角的圆角半径。
Border-top-right-radius:该属性用于指定右上角的圆角半径。
Border-bottom-left-radius:该属性用于指定左下角的圆角半径。
Border-bottom-right-radius:该属性用于指定右下角的圆角半径。
11、box-shadow:是一个复合属性,box-shadow属性为盒模型添加阴影。它包含有以下5个属性值。
hOffset:该属性值控制阴影在水平方向的偏移。
vOffset:该属性值控制阴影在垂直方向的偏移。
blurLength:该属性值控制阴影的模糊程度。
ScaleLength:该属性值控制阴影的缩放程度。
Color:该属性值控制阴影的颜色。
这是我所学到的css样式,分享给你们,希望可以帮助到你们。
以上就是我的分享,新手上道,请多多指教。如果有更好的方法或不懂得地方欢迎在评论区教导和提问喔!