CSS层叠样式表常见属性有哪些-创新互联

这篇文章主要介绍了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许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。