CSS常用属性大全

字体属性：(font)
大小 font-size: x-large;(特大) xx-small;(极小) 一般中文用不到，只要用数值就可以，单位：PX、PD
样式 font-style: oblique;(偏斜体) italic;(斜体) normal;(正常)
行高 line-height: normal;(正常) 单位：PX、PD、EM
粗细 font-weight: bold;(粗体) lighter;(细体) normal;(正常)
变体 font-variant: small-caps;(小型大写字母) normal;(正常)
大小写 text-transform: capitalize;(首字母大写) uppercase;(大写) lowercase;(小写) none;(无)
修饰 text-decoration: underline;(下划线) overline;(上划线) line-through;(删除线) blink;(闪烁)
字体投影效果：filter:dropshadow(color=#FFFFFF, offx=1, offy=1, positive=1);

背景属性： (background)
色彩background-color: #FFFFFF;
图片background-image: url();
重复background-repeat: repeat; no-repeat; repeat-x; repeat-y;
滚动background-attachment: fixed;(固定) scroll;(滚动)
位置background-position: left(水平) top(垂直);bottom; right; center;
简写方法 background:#000 url(..) repeat fixed left top;

区块属性： (Block)
字间距letter-spacing: normal; 数值
对齐text-align: justify;(两端对齐) left;(左对齐) right;(右对齐) center;(居中)
缩进text-indent: 数值px;
垂直对齐vertical-align: baseline;(基线) sub;(下标) super;(下标) top; text-top; middle; bottom; text-bottom;
单词间距word-spacing: normal; 数值
空格white-space: pre;(保留) nowrap;(不换行)
显示display:block;(块) inline;(内嵌) list-item;(列表项) run-in;(追加部分) compact;(紧凑) marker;(标记) table; inline-table; table-raw-group; table-header-group; table-footer-group; table-raw; table-column-group; table-column; table-cell; table-caption;(表格标题)

方框属性： (Box)
width:; height:; float:; clear:both; margin:; padding:; 顺序：上右下左

边框属性： (Border / border-top / border-right / border-bottom / border-left)
border-style: dotted;(点线) dashed;(虚线) solid; double;(双线) groove;(槽线) ridge;(脊状) inset;(凹陷) outset;
border-width:; 边框宽度
border-color:#;
简写方法border：width style color;

列表属性： (List-style)
类型list-style-type: disc;(圆点) circle;(圆圈) square;(方块) decimal;(数字) lower-roman;(小罗码数字) upper-roman; lower-alpha; upper-alpha;
位置list-style-position: outside;(外) inside;
图像list-style-image: url(..);

定位属性： (Position)
Position（定位）: absolute（绝对）; relative（相对）; static（静态）;
visibility（可见性）: inherit（继承）; visible（可见）; hidden（隐藏）;
overflow（溢出）: visible（可见）; hidden（隐藏）; scroll（滚动）; auto（自动）;
clip（裁切）: rect(12px,auto,12px,auto)
CSS连接属性：a:link (超链接格式); a:visited (浏览过的); a:active (按下去的)；a:hover（鼠标转到链接）

鼠标光标样式：（CURSOR：）
Hand手指；crosshair十字体；s-resize箭头朝下；move十字箭头；move箭头朝右；help加一问号；w-resize箭头朝左；n-resize箭头朝上；ne-resize箭头朝右上；nw-resize箭头朝左上；text文字I型；se-resize箭头斜右下；sw-resize箭头斜左下；wait漏斗；p {cursor:url("光标文件名.cur"),text;} 光标图案(IE6)

1、布局常用CSS命名：
warp/warpper 外套(整体布局)   content  容器 main  页面主体  content/container  内容块
site  站点   layout  布局 column  栏   sidebar  侧栏  nav  导航  
center  中  left  左    right  右

2、模块常用CSS命名：
header  页头    footer  页脚   logo  标志   banner   广告
login  登录    loginbar  登录条   regsiter  注册   search   搜索
subnav  子导航    tab   标签页/标签  menu  菜单   submenu  子菜单
scroll  滚动    hot   热点   vote  投票   list    文章列表
news  新闻    download 下载   guide  指南   service   服务
joinus  加入    partner  合作伙伴  friendlink 友情链接  copyright  版权
shop 购物车(功能区)  source  资源   map  网站地图  homepage  首页

3、导航常用CSS命名：
nav   导航外套   mainbav   主导航   subnav    子导航   
sidebar   边导航   topnav   顶导航    sidebaricon   边导航图标
leftsidebar  左导航    rightsidebar  右导航   menucontainer  菜单容器  
dropmunu  下拉菜单  menu   菜单    submenu   子菜单

4、类常用CSS命名：　
title  标题   summary  摘要  status  状态   spce  特别 scroll 滚动
label  标签   current   当前  msg  提示信息  tips   小技巧
submit  提交按钮  btn    按钮  icon  图标   note  注释
red   红色   textbox   文本框  drop  下拉   form  表单
breadcrumb 导航提示  crumb   导航  count  统计   cor/corner  转角/圆角

5、文件常用命名：
master.css  主要文件 base.css   基本共用 layout.css  布局，版面  
module.css  模块  themes.css  主题   columns.css  专栏
font.css   文字   mend.css  补丁  forms.css  表单   print.css   打印

6、hack速查:
屏蔽IE浏览器（也就是IE下不显示）
*:lang(zh) select {font:12px  !important;}  select:empty {font:12px  !important;}  这里select是选择符，根据情况更换。第二句是MAC上safari浏览器独有的。
仅IE7与IE5.0可以识别  *+html  select {…}
仅IE7可以识别 　　  *+html  select {…!important;}
IE6及IE6以下识别  * html  select {…}   或html/**/ >body  select {…}
仅IE6不识别   selct { display /*屏蔽IE6*/:none;}
仅IE6与IE5不识别  select/**/ { display /*IE6,IE5不识别*/:none;}
仅IE5不识别，屏蔽IE5 select/*IE5不识别*/ {…}
盒模型解决方法
selct {width:IE5.x宽度; voice-family :"\"}\""; voice-family:inherit; width:正确宽度;}盒模型的清除方法不是通过!important来处理的。这点要明确。
清除浮动
select:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}在Firefox中，当子级都为浮动时，那么父级的高度就无法完全的包住整个子级，那么这时用这个清除浮动的HACK来对父级做一次定义，那么就可以解决这个问题。
截字省略号
select { -o-text-overflow:ellipsis; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
只有Opera识别
@media all and (min-width: 0px){ select {……} }
针对Opera浏览器做单独的设定。