常用的CSS命名规则:

头:header  内容:content/container 尾:footer 导航:nav 侧栏:sidebar
栏目:column 页面外围控制整体布局宽度:wrapper 左右中:left right center
登录条:loginbar  标志:logo  广告:banner  页面主体:main  
热点:hot
新闻:news  下载:download  子导航:subnav  菜单:menu
子菜单:submenu  搜索:search  友情链接:friendlink  页脚:footer
版权:copyright  滚动:scroll  内容:content  标签页:tab
文章列表:list  提示信息:msg  小技巧:tips  栏目标题:title
加入:joinus  指南:guild  服务:service  注册:regsiter
状态:status  投票:vote  合作伙伴:partner
(二)注释的写法:
  /* Footer */
  内容区
  /* End Footer */
(三)id的命名:
(1)页面结构
  容器: container  页头:header  内容:content/container
  页面主体:main  页尾:footer  导航:nav
  侧栏:sidebar  栏目:column  页面外围控制整体布局宽度:wrapper
  左右中:left right center
(2)导航
  导航:nav  主导航:mainbav  子导航:subnav
  顶导航:topnav  边导航:sidebar  左导航:leftsidebar
  右导航:rightsidebar  菜单:menu  子菜单:submenu
  标题: title  摘要: summary
(3)功能
  标志:logo  广告:banner  登陆:login  登录条:loginbar
  注册:regsiter  搜索:search  功能区:shop
  标题:title  加入:joinus  状态:status  按钮:btn
  滚动:scroll  标签页:tab  文章列表:list  提示信息:msg
  当前的: current  小技巧:tips  图标: icon  注释:note
  指南:guild 服务:service  热点:hot  新闻:news
  下载:download  投票:vote  合作伙伴:partner
  友情链接:link  版权:copyright
(四)class的命名:
(1)颜色:使用颜色的名称或者16进制代码,如
  .red { color: red; }
  .f60 { color: #f60; }
  .ff8600 { color: #ff8600; }
(2)字体大小,直接使用’font+字体大小’作为名称,如
  .font12px { font-size: 12px; }
  .font9pt {font-size: 9pt; }
(3)对齐样式,使用对齐目标的英文名称,如
  .left { float:left; }
  .bottom { float:bottom; }
(4)标题栏样式,使用’类别+功能’的方式命名,如
  .barnews { }
  .barproduct { }
注意事项::
1.一律小写;
2.尽量用英文;
3.不加中杠和下划线;
4.尽量不缩写,除非一看就明白的单词.
主要的 master.css  模块 module.css  基本共用 base.css
布局,版面 layout.css  主题 themes.css  专栏 columns.css
文字 font.css  表单 forms.css  补丁 mend.css  打印 print.css

DIV+CSS 命名规范的更多相关文章

  1. div+css命名规范大全

    网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率, 我们开发DIV+CSS网页(Xhtml)时候,比较困惑和纠结的事就是CSS命名,特别是新手不知道什么 ...

  2. [转]HTML DIV+CSS 命名规范大全

    原文链接 常用DIV+CSS命名大全集合,即CSS命名规则 我们开发CSS+DIV网页(Xhtml)时候,比较困惑和纠结的事就是CSS命名,特别是新手不知道什么地方该如何命名,怎样命名才是好的方法. ...

  3. DIV+CSS命名规范-转载1

    命名规则说明: 1).所有的命名最好都小写 2).属性的值一定要用双引号("")括起来,且一定要有值如class="divcss5",id="divc ...

  4. DIV+CSS命名规范-转载2

    一.CSS文件及样式命名1.CSS文件命名规范 全局样式:global.css: 框架布局:layout.css: 字体样式:font.css: 链接样式:link.css: 打印样式:print.c ...

  5. [html] 有利于seo优化的div+css命名规范

    搜索引擎优化(seo)对命名规范有很多要求,下面是我收集的一些当下主流的命名(还是比较常用的): CSS样式命名 说明 网页公共命名 #wrapper 页面外围控制整体布局宽度 #container或 ...

  6. Div+CSS命名规范

    注意事项:1.命名遵循驼峰式  2.尽量用中文  3.不加中杠和下划线   4.尽量不缩写,除非一看就明白的单词 头:header   标志:logo  友情链接:friendlink    内容:c ...

  7. div,css命名规范!

    命名规则说明: 1).所有的命名最好都小写 2).属性的值一定要用双引号("")括起来,且一定要有值如class="pcss5",id="pcss5& ...

  8. web前端开发CSS命名规范参考

    做为一个web前端工程师,每天接触HTML.css就像吃饭一样,但是作为一名合作.优秀的web前端工程师,对DIV+CSS命名还是有一定的规范的,本文整理了一份web前端开发中DIV+CSS各种命名规 ...

  9. 网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率,具体DIV CSS命名规则CSS命名大全内容如下:

    页头:header  如:#header{属性:属性值;}或.header{属性:属性值;},也许你需要了解class与id区别及用法登录条:loginBar         标志:logo      ...

随机推荐

  1. 【ERROR】EXP-00091

    问题: 在我们做exp的过程中可能经常会遇到EXP-00091: Exporting questionable statistics.这样的EXP信息,其实它就是exp的error message,它 ...

  2. Maven + Eclipse + Tomcat - 开启项目调试之旅(转载)

    本文的读者需要拥有一些Maven基础知识和实践,如果没有,请直接绕过或者先看一些关于Maven教程,比如Juven翻译的<Maven权威指南>,google一下便知. 开门见山,首先抛出一 ...

  3. PO_职位职务审批模式详解(设定)

    2014-06-03 Created By BaoXinjian

  4. Accounting_会计基础

    会计基础 1.会计:是以货币为主要计量单位,反映和监督一个单位经济活动的一种经济管理工作. 2.会计核算职能:指以货币为主要计量单位,通过确认.记录.计算.报告等环节,对特定主体的经济活动进行记账.算 ...

  5. OAF_OAF Framework页面分析(概念)

    20150506 Created By BaoXinjian

  6. JWPlayer高速入门指南(中文)

    将JW Player嵌入到网页中很的简单,仅仅须要进行例如以下3个步骤: 1.解压mediaplayer-viral.zip文件.将jwplayer.js和player.swf文件复制到project ...

  7. 使用Xfire发布WebService接口遇到的问题:

    问题一: log4j:WARN No appenders could be found for logger (org.codehaus.xfire.transport.DefaultTranspor ...

  8. Linux下的tree命令 --Linux下文件夹树查看

    Linux下的tree命令 --Linux下文件夹树查看 有时我们须要生成文件夹树结构,能够使用的有ls -R,可是实际效果并不好 这时须要用到tree命令,可是大部分Linux系统是默认不安装该命令 ...

  9. Notes on PEP333 (Python Web Server Gateway Interface)

    This note is about PEP3333- Python Web Server Gateway Interface. Refer to (Source: http://legacy.pyt ...

  10. 【Android】11.3 屏幕旋转和场景变换过程中GridView的呈现

    分类:C#.Android.VS2015: 创建日期:2016-02-21 一.简介 实际上,对于布局文件中的View来说,大多数情况下,Android都会自动保存这些状态,并不需要我们都去处理它.这 ...