3.CSS中常见属性详解

1.颜色属性

color属性定义文本的颜色

color:green color:#fff660

简写：color:#f60

红(R),绿（G），蓝（B）每个取值范围0-255 color:RGB(255,255,255)

RGBA 是代表red green blue 和Alpha的透明度 color:reba:()255,255,255,1;

2.字体属性

1）字体大小 font-size:14px;

2) font-family定义字体： font-family:微软雅黑，serif;(可以使用"，"隔开，以确保当字体不存在的时候终结使用下一个)

3）font-weight字体加粗

normal(默认值)，bold（粗），bolder（更粗），lighter（更细）

100，200，300——900

400=normal，而700＝bold

3.背景属性background-color

1）背景属性background-color：green

2）背景图片：background－color：url(图片路径)也可以为空none;

3）背景重复 background-repeat

重复平铺满：repeat

向X轴重复：repeat-x

向Y轴重复：repeat-y

不重复：no－repeat

4）背景位置background-position

横

向（left，center，right）

纵向：（top,center,bottom）

5）简写方式

background:背景颜色 url（图像） 重复 位置

background:#f70 url(image/bg.jpg no-repeat top center)

4.文本属性

1）text-align 横向排列 left center right

2）line-height 文本行高 

1‘％基于字体大小的百分比行高

2’数值 设置固定值

3）text-indent 首行缩紧

4）letter-spacing 字符间距

5.边框属性

1）边框风格

1‘单独定义某一方向的边框样式

border-bottom-style 下边边框样式

border-top-style 上边框样式

border-left-style 左边边框样式

border-right-style 右边边框样式

2‘边框风格样式的属性

1''none无边框   2''solid 直线边框   3''dashed 虚线边框   4''dotted 点状边框   5''double 双线边框

6''groove 凸槽边框   7'' ridge 垄状边框   8''outset outset边框  9''inset inset边框  10'' inherit 继承

6.列表属性

1）标记的类型 list-style-type

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, 等。)

cjk-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, 等。（日文片假名）

2)标记的位置 list-style-position

inside 列表项目标记放置在文本以内，且环绕文本标记对齐

outside 默认值，保持标记位于文本的左侧，列表项目标记放置在文本以外，且环绕文本不根据标记对齐

inherit 规定应该从父元素继承list-style-portion 属性的值

3)设置图像列表标记 list－style-image

url 图像的路径 none 默认无图形  inherit 规定应该从父元素继承list-style-image属性的值

4）简写方式 list-style

list-style:square inside url();