CSS的属性(1+XWeb证书个人整理)

CSS背景属性: CSS允许任何元素添加纯色作为背景,也允许使用图像作为背景,并且可以精准的控制背景图像,已达到精美的效果

background-color:
用于设置背景颜色,初始值为透明色,既可以从负元素继承也可以直接取想要的颜色
例如 颜色名 十六进制颜色 rgb函数

background-image:
用于设置背景颜色,初始值为透明色,既可以从负元素继承。也可以直接取想要的颜色
用于设置元素的背景图片,默认值为none如果设置了图片URL,格式为url
并沿着X的Y轴平铺占满元素全部尺寸,通常需要配合background-repeat控制图像的平铺

background-repeat:
默认值为repeat,向沿着X和Y轴平铺,还可以指定沿着X轴平铺repeat-x,沿着轴平铺repeat-y或者不平铺轴平铺no-repeat,继承父元素该属性设置inherit

background-attachment:
用于设置背景图像是否固定或者随着页面的其余部分滚动,初始值为scroll,表示背景图片会随着页面其余部分的滚动而滚动,还可以设置fixed,表示当页面其余部分滚动时,背景图像不会滚动,也可以设置inherit继承父元素的background-attachment设置

background-position:
用于设置背景图像圆点的位置,如果图像需要平铺,则从这一点开始平铺,默认值为左上角零点位置,写作0 0
位置参数: X轴有3个参数,分别是left,center,right y轴同样有3个参数,分别是top,center,bottom 通常X轴和Y轴参数各取一个组属性值,如 left bottom 表示左下角,right top表示右下角,如果给定一个值,则另一个值默认为50%
百分比: 写为x% y%,第一个表示X轴位置,第二个表示Y轴位置,左上角为0 0,右下角为100% 100%,如果只给定一个值则,另一个值默认为50%
长度: 写为xpos ypos,第一个表示X轴离原点的长度,第二个表示Y轴离原点的长度,其单位可以是px等长度单位,也可以是与百分比混合使用
background: 一个简写属性,可以在一个样式中将 background-color,background-image,background-repeat,background-attachment,background-position全部设置,也可以省略其中的某几项,将这几项的属性值直接用空格拼接,作为background的属性值即可,还可以直接设置inherit,从父元素继承

CSS字体属性

font-family:用于设置元素的字体
font-size:用于设置字体的尺寸(绝对/相对大小 ,长度,百分比)
font-style:用于设置字体是否是斜体
font-variant:用于设置字体使用小写字体
font-weight:用于设置字体的粗细
font:可以全部设置以上这些

CSS文本属性

color:用于设置文本颜色
direction:用于设置文本方向
letter-spacing:用于设置字符间隔的大小
line-height:用于设置行高
text-align:用于设置文本的水平对齐方式(left左对齐,right右对齐,center居中)
text-decoration:用于文本添加装饰(underline添加下划线,overderline添加上划线,line-through添加删除线,blink添加闪耀效果,none无添加)
text-index:用于设置文本块首行文本缩进
text-shadow:用于设置阴影,默认情况是无阴影
text-transform:用于设置文本的大小写(capitalize首字母大写,uppercase字母全大写,lowercase:字母全小写,none和源文件保持一致)
white-space:用于设置元素内部空白
word-spacing:用于设置单词间的间隔

CSS尺寸属性

height:设置元素的高度
line-height:设置行高
max-height:设置元素的最大高度
max-width:设置元素的最大宽度
min-height:设置元素的最小高度
min-width:设置元素的最小宽度
width:设置元素的宽度

CSS列表属性

list-style:简写属性。用于把所有用于列表的属性设置于一个声明中
list-style-image:将图象设置为列表项标志
list-style-position:设置列表中列表项标志的位置
list-style-type:设置列表项标志的类型

CSS表格属性

border-collapse:设置是否把表格边框合并为单一的边框
border-spacing:设置分隔单元格边框的距离
caption-side:设置表格标题的位置
empty-cells:设置是否显示表格中的空单元格
table-layout:设置显示单元、行和列的算法

CSS内容属性

content属性通常是和:before及:after伪元素选择器配合使用,用于插入生成内容,默认插入内容将显示为行内内容

猜你喜欢

转载自blog.csdn.net/qq_44948696/article/details/109785972
今日推荐