颜色属性
color属性定义文本的颜色 color:green color:#ff6600 简写式:color:#f60 color:rgb(255,255,255) 红(r)、绿(G)、蓝(B)每个的取值范围是0~255 color:rgba(255,255,255,1) a是Alpha的色彩空间透明度取值范围为0~1字体属性
font-size字体大小 px:设置一个固定的值 %:父元素的百分比 smaller:比父元素更小 larger:比父元素更大 inherit:继承父元素的 font-family定义字体 font-family:微软雅黑.serif; 可以使用 , 隔开,以确保当字体不存在的时候直接使用下一个 font-weight字体加粗 normal(默认值)、bold(粗)、bolder(更粗)、lighter(更细) 100、200、300~900 400=normal,而700=bold font-style字体样式 italic 斜体 oblique 倾斜 inherit 继承 font-variant小型大写字母显示文本 normal 标准 small-caps 小型大写字母显示文本 inherit 继承背景属性
背景颜色 background-color 背景图片 background-image background-image:url(图片路径) background-image:none 背景重复 background-repeat repeat 重复平铺满 repeat-x 向y轴重复 repeat-y 向x轴重复 no-repeat 不重复 背景位置 background-position 横向(left,center,right) 纵向(top,center,bottom) 用数值来表示位置 简写方式 background:背景颜色 url 重复 位置 background:#f60 url(images/bg.jpg) no-repeat top center文本属性
text-align 横向排列 left , center , right line-height 文本行高 %基于字体大小的百分比行高 数值来设置固定值 text-indent 首行缩进 px 固定值 ,默认0 inherit 继承 letter-spacing 字符间距 length 设置具体的数值(可以设置为负值) normal 默认 inherit 继承 word-spacing 单词间距 normal标准间距 px固定值 inherit继承 direction 文本方向 ltr从左到右 rtl从右到左 inhert 继承 text-transform 文本大小写 capitalize 每个单词以大写字母开头 uppercas 定义仅有大写字母 lowercase 定义无大写字母,仅有小写字母 inherit 规定从父元素继承 text-transform属性的值边框属性
边框风格 border-style 统一风格(简写风格) border-style 单独定义某一方向的边框样式 border-bottom-style 下边边框样式 border-top-style 上边边框样式 border-left-style 左边边框样式 border-right-style 右边边框样式 边框风格样式的属性值 none 无边框 solid 直线边框 dashed 虚线边框 dotted 点状边框 double 双线边框 groovr 凸槽边框 ridge 垄状边框 inset inset边框 outset outset边框 inherit 继承 边框宽度 border-width 统一风格 border-width 单独风格 border-bottom-width 下边边框宽度 border-top-width 上边边框宽度 border-left-width 左边边框宽度 border-right-width 右边边框宽度 边框宽度的属性值 thin 细边框 medium 中等边框 thick 粗边框 px 固定值得边框 inherit 继承 边框颜色 border-color 统一风格 border-color 单独风格 border-bottom-color 下边边框颜色 border-top-color 上边边框颜色 border-left-color 左边边框颜色 border-right-color 右边边框颜色 属性值 RGB rgb(255,255,255) RGBA rgba(255,255,255,1) 十六进制 #ff0、#ff0000 inherit 继承 属性值得四种情况 一个值 包含上下左右 boder-color:* 两个值 包含上下或者左右 boder-color:* * 三个值 包含上、(左右)、下 boder-color:* * * 四个指 包含上、下、左、右 boder-color:* * * * 简写方式 border:solid 2px #f60列表属性
标记的类型 list-style-type none 无标记 disc 默认。标记是实心圆 circle 标记是空心圆 square 标记是实心方块 decimal 标记是数字 decimal-leading-zero 0开头的数字标记(01,02,03....) lower-roman 小写罗马数字(i,ii,iii。。。。) upper-roman 大写罗马数字(I,II,III、、、、) lower-alpha 小写英文字母 upper-alpha 大写英文字母 lower-greek 小写希腊字母 lower-latin 小写拉丁字母 uppper-latin 大写拉丁字母 hebrew 传统的希伯来编号方式 armenian 传统的亚美尼亚编号方式 georgian 传统的乔治亚编号方式 cjk-ideographic 简单的表意数字 hiragana 标记是: a i u e o ka ki 等 (日文片假名) katakana 标记是: A I U E O KA KI 等 (日文片假名) ... 标记的位置 list-style-position inside 列表项目标记放置在文本以内,且环绕文本根据标记对齐 outside 默认值。保持标记位于文本的左侧。列表项目标记放置在文本以外,且环绕文本不根据标记对齐 inherit 规定应该从复原速度继承list-style-positon属性的值 设置图像列表标记 list-style-image URL 图像的路径 none 默认。无图像被显示 inherit 继承 简写方式 list-style list-style:squre inside url('/i/arrow.jpg');