常用的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. MVC公司架构介绍-事件机制

  2. PO_PO接受入库时的接受方式详解(概念)

    2014-06-03 Created By BaoXinjian

  3. typedef那回事儿

    typedef是一种特殊的声明方式,不过它与普通声明(详见这里)的含义取大不相同.普通声明的主角是“变量”,它或是创建一个新变量或是对外文件变量使用前的声明:而typedef声明的主角则是“类型”,通 ...

  4. centos部署supervisor

    #!/bin/bash yum -y install python-setuptools ping pypi.python.org -c 4 >/dev/null 2>&1 eas ...

  5. SM系列国密算法(转)

    原文地址:科普一下SM系列国密算法(从零开始学区块链 189) 众所周知,为了保障商用密码的安全性,国家商用密码管理办公室制定了一系列密码标准,包括SM1(SCB2).SM2.SM3.SM4.SM7. ...

  6. 解决windows server2012 评估版本过期,系统会自动关机

    解决windows server2012 评估版本过期,系统在1小时后会自动关机. 重置方法:以管理员方式运行命令行,执行slmgr.vbs /rearm,可以使授权延长180天,但是仅能延长5次.

  7. Vue 最传统的新增行,删除行,提交的数据整合

    index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...

  8. js 与 php 时间戳的区别(毫秒与秒的计算方式)

    js是以毫秒为单位计算的,php是以秒为单位计算的,所以转换时记得*/1000 //距离时间的时间戳 var suoshengshijian = <?php echo $expire_time_ ...

  9. django中templates阅读笔记

    一.基本知识 1.模版是独立于django的,可以独立运行. 模版变量是用两个大括号括起来的字符串,表示变量.例如{{ person_name }} 模版标签,是用一对大括号和一对百分号括起来的,例如 ...

  10. Windows 7/8/10 系统下Laravel框架的开发环境安装及部署详解(Vagrant + Homestead)

    注意! laravel/homestead box项目地址已经不再是原来的 https://atlas.hashicorp.com/laravel/boxes/homestead 而已经变更成 htt ...