189 8069 5689
这篇文章主要介绍了CSS层叠样式表常见属性有哪些，具有一定借鉴价值，感兴趣的朋友可以参考下，希望大家阅读完这篇文章之后大有收获，下面让小编带着大家一起了解一下。
常见属性
1 颜色属性
color属性定义文本的颜色
color:green
color:#ff6600
color:#f60(简写式)
color:rgb(255,255,255) 红(R).绿(G).蓝(B)每个的取值范围0-255
color:rgba(255,255,255,1) RGBA是代表Red(红色).Green(绿色).Blue(蓝色)和Alpha的(色彩空间)透明度
2 字体属性
2.1 font-size 字体大小
font-size:14px
2.2 font-family 定义字体
font-family:微软雅黑，serif;
可以使用","隔开，以确保当字体不存在的时候直接使用下一个
2.3 font-weight 字体加粗
normal(默认值).bold(粗).bolder(更粗).lighter(更细)
100.200.300-900 400=normal，而700=bold
3 背景属性
3.1 背景颜色 background-color
3.2 背景图片 background-p_w_picpath
background-p_w_picpath:url(图片路径)
background-p_w_picpath:none
3.3 背景重复 background-repeat
repeat 重复平铺满
repeat-x 向X轴重复
repeat-y 向Y轴重复
no-repeat 不重复
3.4 背景位置 background-position
横向(left,center,right)
纵向(top,center,bottom)
3.5 简写方式
background:背景颜色 url(图像)重复 位置
background:#f60 url(p_w_picpaths/bg.jpg)no-repeat top center
4 文本属性
4.1 text-align 横向排列 left,center,right
4.2 line-height 文本行高
%基于字体大小的百分比行高
数值来设置固定值
4.3 text-indent 首行缩进
4.4 letter-spacing 字符间距
normal 默认
length 设置具体的数值（可以设置负值）
inherit 继承
5 边框属性
5.1 边框风格 border-style
5.1.1 统一风格（简写风格） border-style
5.1.2 单独定义某一方向的边框样式
border-bottom-style 下边边框样式
border-top-style 上边边框样式
border-left-style 左边边框样式
border-right-style 右边边框样式
5.1.3 边框风格样式的属性值
none 无边框
solid 直线边框
dashed 虚线边框
dotted 点线边框
double 双线边框
groove 凸槽边框
ridge 垄状边框 依托border-color的属性值
inset inset边框
outset outset边框
inherit 继承
5.2 边框宽度 border-width
5.2.1 统一风格 border-width
5.2.2 单独风格
border-top-width 上边边框宽度
border-bottom-width 下边边框宽度
border-left-width 左边边框宽度
border-right-width 右边边框宽度
5.2.3 边框宽度的属性值
thin 细边框
medium 中等边框
thick 粗边框
px 固定值的边框
inherit 继承
5.3边框颜色 border-color
5.3.1 统一风格 border-color
5.3.2 单独风格
border-top-color 上边边框颜色
border-bottom-color 下边边框颜色
border-left-color 左边边框颜色
border-right-color 右边边框颜色
5.3.3 属性值
颜色值的名称 red.green
RGB rgb（255.255.0）
RGBA rgba（255.255.0.0.1）
十六位进制 #ff0.#ff0000
继承 inherit
5.3.4 属性值的四种情况
一个值:border-color:（上.下.左.右）
两个值:border-color:（上下）（左右）
三个值:border-color:（上）（左右）（下）
四个值:border-color:（上）（右）（下）（左）
5.3.5 简写方式 border:solid 2px #f60
6 列表属性
6.1 标记的类型 list-style-tyle
none 无标记
disc 默认，标记是实心圆
circle 标记是空心圆
square 标记是实心方块
decimal 标记是数字
decimal-leading-zero 0开头的数字标记（01,02,03，等）
lower-roman 小写罗马数字（i,ii,iii,iv,v等）
upper-roman 大写罗马数字（I,II,III,IV,V等）
lower-alpha 小写英文字母The marker is lower-alpha（a,b,c,d,e,等）
upper-alpha 大写英文字母The marker is upper-alpha（A,B,C,D,E,等）
lower-greek 小写希腊字母（alpha,beta,gamma,等）
lower-latin 小写拉丁字母（a,b,c,d,e,等）
upper-latin 大写拉丁字母（A,B,C,D,E,等）
hebrew 传统的希伯来编号方式
armenian 传统的亚美尼亚编号方式
georgian 传统的乔治亚编号方式（an，ban，gan，等）
cik-ideographic 简单的表意数字
hiragana 标记是：a,i,u,e,o,ka,ki,等。（日文片假名）
katakana 标记是：A,I,U,E,O,KA,KI,等。（日文片假名）
hiragana-iroha 标记是：i,ro,ha,ni,ho,he,to,等。（日文片假名）
katakana-iroha 标记是：I,RO,HA,NI,HO,HE,TO,等。（日文片假名）
6.2 标记的位置 list-style-position
inside 列表项目标记放置在文本以内，且环绕文本根据标记对齐
outside 默认值，保持标记位于文本的左侧，列表项目放置在文本以外，且环绕文本不根据标记对齐
inherit 规定应该从父元素继承list-style-position属性的值
6.3 设置图像列表标记 list-style-p_w_picpath
URL 图像的路径
none 默认，无图形被显示
inherit 规定应该从父元素继承list-style-p_w_picpath属性的值
6.4 简写方式 list-style
list-style:square inside url('/i/arrow.jpg')
感谢你能够认真阅读完这篇文章，希望小编分享的“CSS层叠样式表常见属性有哪些”这篇文章对大家有帮助，同时也希望大家多多支持创新互联，关注创新互联行业资讯频道，更多相关知识等着你来学习!
另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。