1.CSS ID 的命名 外 套: wrap 主导航: mainnav 子导航: subnav 页 脚: footet 整个页面: content 页 眉: header 页 脚: footer 商 标: label 标 题: title 主导航: mainbav(globalnav) 顶导航: topnav 边导航: sidebar 左导航: leftsidebar 右导航: rightsidebar 旗 志: logo 标 语: banner 菜单内容1: menu1 content 菜单容量: menu container 子菜单: submenu 边导航图标:sidebarIcon 注释: note 面包屑: breadcrumb(即页面所处位置导航提示) 容器: container 内容: content 搜索: search 登陆: Login 功能区: shop(如购物车,收银台) 当前的 current 2.另外在编辑样式表时可用的注释可这样写: <-- Footer --> 内容区 <-- End Footer --> 3.样式文件命名 主要的 master.css 布局,版面 layout.css 专栏 columns.css 文字 font.css 打印样式 print.css 主题 themes.css 注:来源于“烟儿圈教程网” css命名: 页头:header 登录条:loginbar 标志:logo 侧栏:sidebar 广告:banner 导航:nav 子导航:subnav 菜单:menu 子菜单:submenu 搜索:search 滚动:scroll 页面主体:main 内容:content 标签页:tab 文章列表:list 提示信息:msg 小技巧:tips 栏目标题:title 加入:joinus 指南:guild 服务:service 热点:hot 新闻:news 下载:download 注册:regsiter 状态:status 按钮:btn 投票:vote 合作伙伴:partner 友情链接:friendlink 页脚:footer 版权:copyright 3.样式文件命名 基本的 base.css 主要的 master.css 布局,版面 layout.css 局部 part.css 专栏 columns.css 文字 font.css 打印样式 print.css 主题 themes.css 4.缩写命名 左浮 fl = float:left; 右浮 fr = float:right; 清楚浮动 clear = clear:both; 左对齐 tl = text-align:left; 右对齐 tri = text-align:right; 居中 tc = text-align:center; 宽度 w1(width) = 1px……..w1000 = 1000px 高度 h1(height) = 1px……..h1000 = 1000px 清楚边框 bd_n = border:none!important; 加粗 fw_b = font-weight:bold; 清楚加粗 fw_n = font-weight:normal; 隐藏块 dp_n = disipay:none; 显示块 dp_b = disipay:block; 清楚背景色 bg_n = background:none; 外边距(上右下左) m_05 = margin:5px; 外边距(上下左右) m_0510 = margin:5px 10px; 外边距(上左右下) m_051007 = margin:5px 10px 7px; 外边距(上) mt_10 = margin-top:10px; 外边距(右) mr_10 = margin-right:10px; 外边距(下) mb_10 = margin-bottom:10px; 外边距(左) ml_10 = margin-left:10px; 内边距(上右下左) p_05 = padding:5px; 内边距(上下左右) p_0510 = padding:5px 10px; 内边距(上左右下) p_051007 = padding:5px 10px 7px; 内边距(上) pt_10 = padding-top:10px; 内边距(右) pr_10 = padding-right:10px; 内边距(下) pb_10 = padding-bottom:10px; 内边距(左) pl_10 = padding-left:10px; 如:<div class="fl h100">www.hemin.cn</div>//适合做大型网站重复调用样式 5.颜色命名 黑色 black = #000 白色 white = #FFF 灰色 gray = #999 #666 #333 红色 gules = #F00 黄色 yellow= #FF0 蓝色 blue = #00F 绿色 green = #0F0 青色 cyan = #0FF 紫色 purple= #F0F 缩写 #F0F = #FF00FF 如:<div><a href="#">hm</a><a class="gules" href="#">hemin</a></div> 皆可
http://xiaozmn.javaeye.com/category/31298?show_full=true
