zoukankan      html  css  js  c++  java
  • 常用的css命名规则:

    关于团队合作的css命名规范

    常用的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

    http://www.qianduan.net/css-selectors-naming-2.html

     

    原创文章转载请注明:

    转载自AlloyTeam:http://www.alloyteam.com/2011/10/107/

  • 相关阅读:
    【svn】一个设置,少写几个字
    转眼一年
    linux虚拟机与windows主机传输文件方法
    meta常用命令
    Metasploit 读书笔记-持久控制
    Metasploit 读书笔记-神器Meterpreter
    [工作]采购失误
    解决:kali linux 在vmware 虚拟机中使用bridge模式上网的问题
    metasploit 读书笔记-EXPLOITATION
    [共鸣]温州600住户合买高音炮 还击广场舞大妈
  • 原文地址:https://www.cnblogs.com/rdst/p/4704793.html
Copyright © 2011-2022 走看看