当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > div+css样式表的id和class常用命名规则

CSS样式表
IE和Firefox浏览器CSS网页布局不同点
CSS改变选择网页文字背景色
CSS3教程(1):什么是CSS3
浏览器Apple Safari和Google Chrome内核webkit
YaHoo方法:CSS Reset重设浏览器的样式
你知道吗?CSS样式表也能挂网页木马
通过宜家的家具设计方法学习CSS模块化
可读性CSS代码编写的小技巧
建议网页开发者使用IE8测试版测试网站
帮我写出更好的CSS代码的一些技巧
CSS初学福音:解决你对英文单词的不理解
两个CSS代码精简工具(网页推荐)
IE6图片元素img下出现多余空白的问题
将设计稿转换成WEB页面职业者
W3C标准以及XHTML和HTML
网页字体该如何设置?
学CSS网页布局排查错误的方法
CSS常见的让元素水平居中显示的方法
CSS网页布局教程:CSS伪类定义3种方法
CSS模块化思想的优势

CSS样式表 中的 div+css样式表的id和class常用命名规则


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-01-10   浏览: 79 ::
收藏到网摘: n/a

要是就几行或几十行代码吧!就根据英文单词就行了。可是要是多了那就不好写了,有时候就直接用汉语拼音或拼音的首字母代替。可是多了吧,自己写的都看不出是什么意思,别说再让程序员调用这些样式了。div+css样式表的id和class的区别:就一句来概括, class可以定义多个值并且可以应用到多个标签上,但id只能是一个。所以就开始查一些相关的div+css样式表id和class的常用命名规则,请大家参考一下:

  首先讲一下div+css样式表的id的常用命名规则如下表所示:

页头
header
登录条
loginBar
标志
logo
侧栏
sideBar
广告
Banner
导航
nav
子导航
subNav
菜单
menu
子菜单
subMenu
搜索
search
滚动
scroll
页面主体
main
内容
content
标签页
tab
文章列表
list
提示信息
msg
小技巧
tips
栏目标题
title
加入
joinus
指南
guild
服务
service
热点
hot
新闻
news
下载
download
注册
regsiter
状态
status
按钮
btn
投票
vote
合作伙伴
partner
友情链接
friendLink
页脚
footer
版权
copyRight
 
 


     
  实际上上面的div+css样式表的id命名也会经常用大小写和_来区分,比如主导航就是MainNav,如果还有必要在区分就是MainNav_1,MainNav_2等等。也可以使用"类型+变量名称"的规则来命名,比如写一个红色字体的class,可以.f_red {}(f是font 字体的缩写)。总之原则是:大小写、_、缩写,大大增强代码的可读性。


  再讲一下div+css样式表的class的常用命名规则如下表所示:

 外 套
wrap
主导航
mainNav
子导航
subnav
页 脚
footer
整个页面
content
页 眉
header
商 标
label
标 题
title
主导航
mainNav
边导航
sidebar
左导航
leftsideBar
右导航
rightsideBar
旗 志
logo
标 语
banner
菜单内容
menu1Content
菜单容量
menuContainer
子菜单
submenu
边导航图标
sidebarIcon
注释
note
面包屑
breadCrumb
容器
container
内容
content
搜索
search
登陆
login
功能区
shop
当前的
current
 
 

  当然像div+css样式表的id和class的命名远远不止这些,可能还会有更多的命名,你可以用一些通俗的易懂.容易理解的一些来命名,如果您有更好的div+css样式表的id和class的命名规则的话,请留言,多多指教.