CSS命名规则

头:header
内容:content/containe
  尾: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
XHTML文件中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
XHTML文件中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

CSS XHTML规范化命名参考的更多相关文章

  1. DIV+CSS命名参考

    用了一段CSS布局设计网页,发现自己的命名有点混乱,完全按照自己的想法命名,虽然没什么影响,有不给别人看源文件,但是工作室有时候和团队合作完成项目的时候,就遇到麻烦了,要修改一个地方相当的费事.所以还 ...

  2. html页面的CSS、DIV命名规则

    CSS命名规则 头:header 内容:content/containe 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左右中:l ...

  3. CSS学习笔记(7)--html页面的CSS、DIV命名规则

    html页面的CSS.DIV命名规则 CSS命名规则 头:header 内容:content/containe 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整 ...

  4. css的一些命名规范

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

  5. 学无止境的CSS(xHTML+CSS技巧教程资源大全)

    本文里面收集一些有关CSS的技巧.教程.工具和观点等,其中一些你也许早就运用的炉火纯青,也可能有的你听都没听说过.不管是新手还是高手,大家都继续学习吧. 一,Web 标准 要玩游戏,就得先了解规则.要 ...

  6. css 常用样式命名规则

    大家在写css的时候,对一些html标签起一个合适的名字是个很头疼的事情,现在给大家分享项目中常用的名字供参考. 外套:wrap  ——用于最外层 头部:header  ——用于头部 主要内容:mai ...

  7. CSS模块化思想-----命名是个技术活

    CSS模块化思想(一)--------命名是个技术活 引子: 女孩子都喜欢买衣服,而我也不例外,奈何钱包太瘦,买不起高大上的定制,只能买撞衫率极高的休闲衣,不过对于我来说,我还是开心的,毕竟买衣服买的 ...

  8. html中css、div命名规范

    html中css.div命名规范 1.类class的命名规范示例 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column ...

  9. 再探CSS 中 class 命名规范

    一直以来我的CSS 的 class命名都是比较随意,有时采用驼峰式.有时采用下划线,好像没有什么统一的标准,想到什么英文单词就拿过来用,这对于自己瞎写的小项目无伤大雅,遇到冲突的问题可稍加调整改变即可 ...

随机推荐

  1. codevs 1031 质数环

    题目描述 Description 一个大小为N(N<=17)的质数环是由1到N共N个自然数组成的一个数环,数环上每两个相邻的数字之和为质数.如下图是一个大小为6的质数环.为了方便描述,规定数环上 ...

  2. 转:sprintf与snprintf

    sprintf与snprintf   int sprintf( char *buffer, const char *format [, argument] ... ); 除了前两个参数类型固定外,后面 ...

  3. jmap命令结合mat插件分析内存泄露--OQL

    http://smallnetvisitor.iteye.com/blog/1826434 User.java package gc; import java.util.ArrayList; impo ...

  4. 【转】JAVA 读写二进制文件

    原文网址:http://shiminghua234.blog.163.com/blog/static/263912422011619102350866 import java.io.*; /** * ...

  5. strcpy完整版 与 strcpy为什么有返回值

    一个标准的strcpy函数: 原本以为自己对strcpy还算比较了解,结果面试时还是悲剧了. 下面给出网上strcpy的得分版本: 2分 void strcpy( char *strDest, cha ...

  6. 【剑指offer】面试题24:二叉搜索树的后序遍历序列

    题目: 输入一个整数数组,判断该数组是不是某二叉搜索树的后序遍历的结果.如果是则输出Yes,否则输出No.假设输入的数组的任意两个数字都互不相同. 思路: 递归 注意,主要就是假定数组为空时结果为fa ...

  7. C++Memset误区

    Memset的原型是void *memset(void *s, char ch, size_t n); Memset是按字节赋值的,对char以外的类型赋0(00000000) -1(11111111 ...

  8. Adobe Photoshop CC 2015安装激活

    分享一下Adobe Photoshop CC 2015 安装激活步骤 工具/原料   xf-adobecc2015.exe Adobe Photoshop CC 2015官方原版 方法/步骤   1 ...

  9. java.lang.NoSuchFieldError: INSTANCE

    java.lang.NoSuchFieldError: INSTANCE异常,可能是包重复了. 我遇到的情况是maven里引入了一个JAR,而我又在lib里面引入了这个jar,并且版本还不相同,就出了 ...

  10. Python:ajax 学习笔记

    什么是 AJAX ? AJAX = 异步 JavaScript 和 XML. AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味 ...