DIV命名规范


    • 企业DIV使用频率高的命名方法

    • 网页内容类

      ---

      • 注释的写法: /* Footer */ 内容区/* End Footer */

      • 摘要: summary

      • 箭头: arrow

      • 商标: label

      • 网站标志: logo

      • 转角/圆角: corner

      • 横幅广告: banner

      • 子菜单: subMenu

      • 搜索: search

      • 搜索框: searchBox

      • 登录: login

      • 登录条:loginbar

      • 工具条: toolbar

      • 下拉: drop

      • 标签页: tab

      • 当前的: current

      • 列表: list

      • 滚动: scroll

      • 服务: service

      • 提示信息: msg

      • 热点:hot

      • 新闻: news

      • 小技巧: tips

      • 下载: download

      • 栏目标题: title

      • 热点: hot

      • 加入: joinus

      • 注册: regsiter

      • 指南: guide

      • 友情链接: friendlink

      • 状态: status

      • 版权: copyright

      • 按钮: btn

      • 合作伙伴: partner

      • 投票: vote

      • 左右中:left right center

      • 标题: title

    • id的命名:

      ---

      • 导航:nav

      • 主导航:mainbav

      • 子导航:subnav

      • 顶导航:topnav

      • 边导航:sidebar

      • 左导航:leftsidebar

      • 右导航:rightsidebar

      • 菜单:menu

      • 子菜单:submenu

      • 标题: title

      • 摘要: summary

      • 容器: container

      • 页头:header

      • 内容:content/container

      • 页面主体:main

      • 页尾:footer

      • 导航:nav

      • 侧栏:sidebar

      • 栏目:column

      • 页面外围控制整体布局宽度:wrapper

      • 左右中:left right center

      • 页面结构

        ---

      • 导航


      • 标志: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的命名:

        • .barnews { }

        • .barproduct { }

        • .left { float:left; }

        • .bottom { float:bottom; }

        • .font12px { font-size: 12px; }

        • .font9px {font-size: 9pt; }

        • .red { color: red; }

        • .f60 { color: #f60; }

        • .ff8600 { color: #ff8600; }

        • 颜色:使用颜色的名称或者16进制代码,如

        • 字体大小,直接使用"font+字体大小"作为名称,如

        • 对齐样式,使用对齐目标的英文名称,如

        • 标题栏样式,使用"类别+功能"的方式命名,如

---

      • 注意事项::

        • 一律小写;

        • 尽量用英文;

        • 不加中杠和下划线;

        • 尽量不缩写,除非一看就明白的单词.

---

  • 推荐的 CSS 书写顺序:

    • color

    • font

    • text-decoration

    • text-align

    • vertical-align

    • white-space

    • other text

    • content

    • width

    • height

    • margin

    • padding

    • border

    • background

    • display

    • list-style

    • position

    • float

    • clear

    • 显示属性

    • 自身属性

    • 文本属性

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

  1. html中css、div命名规范

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

  2. div 命名规范! (野路子出来的好好看看)

    DIV命名规范   DIV命名规范 企业DIV使用频率高的命名方法 网页内容类 --- 注释的写法: /* Footer */ 内容区/* End Footer */ 摘要: summary 箭头:  ...

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

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

  4. DIV+CSS 规范命名集合

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

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

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

  6. CSS命名规范

    DIV+CSS规范命名大全集合 前端人员必看CSS命名规范 整理: 文件名必须由小写字母.数字.中划线组成 ).所有的命名最好都小写,一律采用小写加中划线的方式,不允许使用大写字母或 _2).属性的值 ...

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

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

  8. html,css命名规范 (转)

    HTML+CSS命名规范总结 1.HTML部分 1.1添加必须的utf-8的字符集,并且使用HTML5的简洁 方式: <meta charset="utf-8"> 1. ...

  9. css 命名规范

    网站头部:    head/header(头部) top(顶部)    导航:   nanv 导航具体区分:topnav(顶部导航).mainnav(主导航).mininav(迷你导航).textna ...

随机推荐

  1. 让函数的input、output更"函数化"

    前言 我们都知道函数的基本形式为:output f(input),且先按这种形式进行input与output的分析,我们的input与output可以有更好的设计方式,而我们的output是选择使用r ...

  2. CF D Bicolorings

    题意 给一个2行n列的矩阵填上黑色和白色,求连通块个数为k个的填色方案数量(mod 998244353)   因为只有两行,为n-1列的矩阵增加1列的情况数只有很少,容易想到用 (i,k) 表示 i  ...

  3. php设计模式总结2

    策略模式: 定义了算法族,分别封装起来,让它们之间可以互相替换,此模式让算法的变化独立于使用算法的客户. 封装:把行为用接口封装起来,我们可以把那些经常变化的部分,从当前的类中单独取出来,用接口进行单 ...

  4. Web前端常见问题

    一.理论知识 1.1.讲讲输入完网址按下回车,到看到网页这个过程中发生了什么 a. 域名解析 b. 发起TCP的3次握手 c. 建立TCP连接后发起http请求 d. 服务器端响应http请求,浏览器 ...

  5. OCR 维护 crsd.log

    ###########sample 1 OCR corruption messages are reported in crsd.log, automatic OCR backup is failin ...

  6. 20篇关于商品管理系统和uml技术的相关文献

    1.基于UML技术的商品管理系统设计与实现 2.UML技术在行业资源平台系统建模中的应用 3.基于JSP的商品信息管理系统设计与开发 4.基于UML技术的客户关系管理系统实现 5.商品管理系统 6.基 ...

  7. python17 多线程学习

    多线程 多任务可以由多进程完成,也可以由一个进程内的多线程完成. 我们前面提到了进程是由若干线程组成的,一个进程至少有一个线程. 由于线程是操作系统直接支持的执行单元,因此,高级语言通常都内置多线程的 ...

  8. 性能测试工具LoadRunner29-LR之测试java代码

    步骤: 1.安装配置JDK(注意LR11最高支持jdk1.6的版本) 2.JAR包的导入 在LR中创建java Vuser脚本并且保存,我保存的文件夹名称为lr_java 将jar包放到这个文件夹下 ...

  9. [转]创建一个JavaScript弹出DIV窗口层的效果

    本文转自:http://www.soso.io/article/23698.html <!doctype html> <html lang="en"> &l ...

  10. [转]JavaScriptSerializer中日期序列化

    本文转自:http://www.cnblogs.com/songxingzhu/p/3816309.html 直接进入主题: class Student { public int age { get; ...