DIV+CSS命名规范,十分的全面,也很详细

2019-09-08 郑州网站建设  

我们开发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

 

摘要

 

#日志inbar

 

登录条

 

#searchInput

 

搜索输入框

 

#hot

 

热门热点

 

#search

 

搜索

 

#search_output

 

搜索输出和搜索结果相似

 

#searchBar

 

搜索条

 

#search_results

 

搜索结果

 

#copyright

 

版权信息

 

#branding

 

商标

 

#标志

 

网站LOGO日志o

 

#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

 

Keywords

 

.b日志

 

博客

 

.forum

 

论坛

 
CSS文件命名   说明  

master.css,style.css

 

主要的

 

module.css

 

模块

 

base.css

 

基本共用

 

layout.css

 

布局,版面

 

themes.css

 

主题

 

columns.css

 

专栏

 

font.css

 

文字、字体

 

forms.css

 

表单

 

mend.css

 

补丁

 

print.css


河南郑州做网站首选天择文化,我们专注郑州网站建设网站设计网站制作与开发,是中原地区专业的郑州网络公司,多年来我们一直努力,服务客户数百家,欢迎您的咨询。
本文链接:郑州网络公司http://tzchb.ieyo.com/dede/1217.html转载请标明出处,谢谢合作!
标签:
  • DIV
  • css
  • 我们
  • +
  • 网页
  • 开发
  • Xhtm