DIV+CSS规范命名集合_html/css_WEB-ITnose
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了DIV+CSS规范命名集合_html/css_WEB-ITnose，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含4157字，纯文字阅读大概需要6分钟。
内容图文
我们开发CSS+DIV网页（Xhtml）时候,比较困惑和纠结的事就是CSS命名，特别是新手不知道什么地方该如何命名，怎样命名才是好的方法。 命名规则说明：
1）、所有的命名最好都小写
2）、属性的值一定要用双引号("")括起来，且一定要有值如class="divcss5",id="divcss5"
3）、每个标签都要有开始和结束，且要有正确的层次，排版有规律工整
4）、空元素要有结束的tag或于开始的tag后加上"/"
5）、表现与结构完全分离，代码中不涉及任何的表现元素，如style、font、bgColor、border等
6）、定义，应遵循从大到小的原则，体现文档的结构，并有利于搜索引擎的查询。
7）、给每一个表格和表单加上一个唯一的、结构标记id
8）、给图片加上alt标签
9）、尽量使用英文命名原则
10）、尽量不缩写，除非一看就明白的单词
相对网页外层重要部分CSS样式命名：
外套wrap------------------用于最外层头部header----------------用于头部主要内容 main------------用于主体内容（中部）左侧main-left-------------左侧布局右侧main- right-----------右侧布局导航条nav-----------------网页菜单导航条内容 content---------------用于网页中部主体底部footer-----------------用于底部
DIV+CSS命名参考表：
以下为CSS样式命名与CSS文件命名参考表，DIV CSS命名集合：
CSS样式命名 | 说明 | |
| 网页公共命名 | ||
| #wrapper | 页面外围控制整体布局宽度 | |
| #container或#content | 容器,用于最外层 | |
| #layout | 布局 | |
| #head,#header | 页头部分 | |
| #foot,#footer | 页脚部分 | |
| #nav | 主导航 | |
| #subnav | 二级导航 | |
| #menu | 菜单 | |
| #submenu | 子菜单 | |
| #sideBar | 侧栏 | |
| #sidebar_a,#sidebar_b | 左边栏或右边栏 | |
| #main | 页面主体 | |
| #tag | 标签 | |
| #msg#message | 提示信息 | |
| #tips | 小技巧 | |
| #vote | 投票 | |
| #friendlink | 友情连接 | |
| #title | 标题 | |
| #summary | 摘要 | |
| #loginbar | 登录条 | |
| #searchInput | 搜索输入框 | |
| #hot | 热门热点 | |
| #search | 搜索 | |
| #search_output | 搜索输出和搜索结果相似 | |
| #searchBar | 搜索条 | |
| #search_results | 搜索结果 | |
| #copyright | 版权信息 | |
| #branding | 商标 | |
| #logo | 网站LOGO标志 | |
| #siteinfo | 网站信息 | |
| #siteinfoLegal | 法律声明 | |
| #siteinfoCredits | 信誉 | |
| #joinus | 加入我们 | |
| #partner | 合作伙伴 | |
| #service | 服务 | |
| #regsiter | 注册 | |
| arr/arrow | 箭头 | |
| #guild | 指南 | |
| #sitemap | 网站地图 | |
| #list | 列表 | |
| #homepage | 首页 | |
| #subpage | 二级页面子页面 | |
| #tool,#toolbar | 工具条 | |
| #drop | 下拉 | |
| #dorpmenu | 下拉菜单 | |
| #status | 状态 | |
| #scroll | 滚动 | |
| .tab | 标签页 | |
| .left.right.center | 居左、中、右 | |
| .news | 新闻 | |
| .download | 下载 | |
| .banner | 广告条(顶部广告条) | |
| 电子贸易相关 | ||
| .products | 产品 | |
| .products_prices | 产品价格 | |
| .products_description | 产品描述 | |
| .products_review | 产品评论 | |
| .editor_review | 编辑评论 | |
| .news_release | 最新产品 | |
| .publisher | 生产商 | |
| .screenshot | 缩略图 | |
| .faqs | 常见问题 | |
| .keyword | 关键词 | |
| .blog | 博客 | |
| .forum | 论坛 | |
| CSS文件命名 | 说明 | |
| master.css,style.css | 主要的 | |
| module.css | 模块 | |
| base.css | 基本共用 | |
| layout.css | 布局，版面 | |
| themes.css | 主题 | |
| columns.css | 专栏 | |
| font.css | 文字、字体 | |
| forms.css | 表单 | |
| mend.css | 补丁 | |
| print.css | 打印 |
慧都提供【正版IDE联合推广计划】，各种IDE低至半价出售（截止日期2014/12/31）。另外还有5折限时抢购和免费领iPhone?6、iPad?air等好礼!
内容总结
以上是互联网集市为您收集整理的DIV+CSS规范命名集合_html/css_WEB-ITnose全部内容，希望文章能够帮你解决DIV+CSS规范命名集合_html/css_WEB-ITnose所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。