日期:2014-05-16  浏览次数:20652 次

常用CSS样式属性(转)
原文地址:http://www.cnblogs.com/sidecore/archive/2013/01/20/2868464.html

【长度单位】
CSS可使用长度单位
单位单位说明范例
pt Point,就像是Word里面的Point一样大小 font-size:10pt
px Pixels,依您屏幕分辨率而决定大小 font-size:10px
pc Pica,6个Pica是一英吋 font-size:10pc
mm 公厘,用过尺...这个设定值完全不会因为其它设定而改变 font-size:10mm
cm 公分,不会因为使用者设定而改变 font-size:10cm
% 百分比,大部分是指所在位置宽度或者长度百分比 font-size:10%


【颜色表示】
CSS可用颜色表示方式
表示方式表示方式说明范例
#rrggbb可以用Windows色彩选择工具找到color:#feefc7
rgb(#,#,#)用数字来表示红色蓝色以及绿色的混合...也可以用Windows色彩选择工具找color:rgb(135,255,124)
rgb(%,%,%)用百分比来代表红色蓝色以及绿色的强度来混合颜色color:rgb(70%,35%,41%)
颜色名称用颜色的名称来指定颜色color:brown


【背景可用值】
CSS可用背景值
名称说明可能值范例
background背景下面的背景设定值皆适用background:fixed
background-attachment背景图性是否固定fixed, scrollbackground-attachment:fixed
background-color背景颜色颜色 transparent(透空)backgroun-color:yellow
background-image背景图片none(无背景图) url(****)(图片位置)background-image:url(test.jpg)
background-position背景图位置水平 垂直background-position:135 159
background-repeat背景是否重复repeat(重复) repeat-x(水平重复) repeat-y(垂直重复) no-repeat(不重复)background-repeat:repeat


【属性可用值】
CSS可用属性值
名称说明可能值范例
visibility显示或是隐藏inherit(父组件决定) hidden(隐藏) visible(显示)  visibility:hidden
width宽度auto(自动决定) 数字width:135
height高度auto(自动决定) 数字height:100
z-indexZ轴高度(立体,是否在另一个组件之上)auto(自动决定) 数字z-index:135
position定位方式absolute (绝对寻址-依窗口坐标,原点为父窗口左上角) relative (相定位-以一般网页排列[right.center.left]后再根据坐标定位,原点为定位后的位置) static(静态定位-以一般网页排列)position:absolute
top(对象的position属性须为absolute或relative)对象的Y坐标(原点根据postion属性有所同)数字
left(对象的position属性须为absolute或relative)对象的X坐标(原点根据postion属性有不同)数字


【文字设定可用值】
CSS可用文字设定值
名称说明可能值范例
font文字设定以下所有皆可使用  font:arial
font-family字体字体名称font-family:arial
font-size字体大小百分比或是数字(单位)font-size:12px
font-style字型样式normal(普通) italic(斜体) oblique(斜体)font-style:italic
font-variant字型特别样式normal(普通) small-caps(大小英文字母)font-variant:small-caps
font-weight字型粗细normal(普通) bold(粗体) bolder(超粗体) lighter(细体) 数字(400=normal 700=bold )font-weight:bolder
letter-spacing字符相距normal(普通) 数字(预设为0)letter-spacing:5
text-align字符对齐left(左边) right(右边) center(中间) justify(左右平分)text-align:justify
text-decoration字符样式none(普通) underline(加底线) no-underline(不加底线) blink(闪烁) no-blink(不闪烁) line-through(加删除线) no-line-throu