您的位置:首页 > Web前端 > CSS

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

2009-10-29 23:31 671 查看
要是就几行或几十行代码吧!就根据英文单词就行了。可是要是多了那就不好写了,有时候就直接用汉语拼音或拼音的首字母代替。可是多了吧,自己写的都看不出是什么意思,别说再让程序员调用这些样式了。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的命名规则的话,请留言,多多指教.
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: