css命名规则 .

内容:content/container
导航:
nav
侧栏:
sidebar
栏目:
column
标志:
logo
页面主体:
main
广告:
banner
热点:
hot
新闻:
news
下载:
download
子导航:
subnav
菜单:
menu
搜索:
search
页脚:
footer
滚动:
scroll
版权:
copyright
友情链接:
friendlink
子菜单:
submenu
内容:
content
标签页:
tab
文章列表:
list
注册:
regsiter
提示信息:
msg
小技巧:
tips
加入:
joinus
栏目标题:
title
指南:
guild
服务:
service
状态:
status
投票:
vote
尾:
footer
合作伙伴:
partner
登录条:
loginbar
页面外围控制整体布局宽度:
wrapper
左右中:
left right center

(
)注释的写法
:
/* Footer */
内容区

/* End Footer */

()id的命名:

(1)页面结构
容器: container 页头:header 内容:content/container
页面主体:main 页尾:footer 导航:
nav
侧栏:sidebar 栏目:column 左右中:
left right center
页面外围控制整体布局宽度:wrapper

(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
主题
themes.css
专栏
columns.css
打印
print.css
文字
font.css
表单
forms.css
补丁
mend.css
布局,版面 layout.css

posted @ 2011-11-02 16:27  你妹的sb  阅读(198)  评论(0编辑  收藏  举报
百度一下