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. php版 日文半角转全角

    工作需要,写的这个 /* *转载请注明 http://www.cnblogs.com/kclteam/p/5278923.html$str //参数可以是字符串或数组*/ function HkToF ...

  2. 三嫖客之awk

    awk '{h[$1]++}END{for(pol in h)print pol,h[pol]}' access.log |sort -rnk2|head awk -F: -vOFS=":& ...

  3. 谨慎使用多线程中的fork 学习!!!!

    前言 在单核时代,大家所编写的程序都是单进程/单线程程序.随着计算机硬件技术的发展,进入了多核时代后,为了降低响应时间,重复充分利用多核cpu的资源,使用多进程编程的手段逐渐被人们接受和掌握.然而因为 ...

  4. RTT之内存管理及异常中断

    内存管理分静态内存管理和动态内存管理(根据大小又分2种) 静态内存管理:创建.删除.初始化.解绑.申请和释放.初始化内存池是属于静态内存管理,与创建内存池不同的是,此处内存池对象所使用的内存空间是由用 ...

  5. tcp的半连接与完全连接队列(三)源码分析

    TCP 协议中的 SYN queue 和 accept queue 处理 若要理解本文意图说明的问题,可能需要以下知识背景: listen 系统调用的 backlog 参数含义,以及与 net.cor ...

  6. ubuntu 16.04安装后不能登入

    启动后,选择ubuntu高级选项,选择恢复模式,在恢复模式下 sudo apt-get update sudo apt-get upgrade 另外,可以在此模式下,选择nvidia驱动

  7. 注意mysql connector的版本

    今天把ubuntu升级到16.04后,使用mysql connector 1.1.8版本(centos 还是ubuntu不清楚)访问数据库,出现莫名其妙的错误. 后来下载mysql connector ...

  8. ORACLE SQL 实现IRR的计算

    一.IRR计算的原理: 内部收益率(Internal Rate of Return (IRR)),就是资金流入现值总额与资金流出现值总额相等.净现值等于零时的折现率. 用公式 标识:-200+[30/ ...

  9. Kudu的概念术语

    不多说,直接上干货! Columnar Data Store(列式数据存储) Kudu 是一个 columnar data store(列式数据存储).列式数据存储在强类型列中.由于几个原因,通过适当 ...

  10. 单元测试-Junit-Mockit-PowerMock

    0. Junit5 1. Junit4 //手动命令行测试 java -cp /usr1/junit:/usr1/cdncms/lib/* org.junit.runner.JUnitCore com ...