css常用的属性大全

CSS常用属性大全
2011-04-22 12:51
字体属性：(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不识别*/ {…}
PS:在css里控制每段开头自动空两格：p { text-indent: 2em;}。