DIV命名规范
DIV命名规范
-
企业
DIV
使用频率高的命名方法 -
网页内容类
---
-
注释的写法:
/* Footer */
内容区/* End Footer */
-
摘要:
summary
-
箭头:
arrow
-
商标:
label
-
网站标志:
logo
-
转角/圆角:
corner
-
横幅广告:
banner
-
子菜单:
subMenu
-
搜索:
search
-
搜索框:
searchBox
-
登录:
login
-
登录条:
loginbar
-
工具条:
toolbar
-
下拉:
drop
-
标签页:
tab
-
当前的:
current
-
列表:
list
-
滚动:
scroll
-
服务:
service
-
提示信息:
msg
-
热点:
hot
-
新闻:
news
-
小技巧:
tips
-
下载:
download
-
栏目标题:
title
-
热点:
hot
-
加入:
joinus
-
注册:
regsiter
-
指南:
guide
-
友情链接:
friendlink
-
状态:
status
-
版权:
copyright
-
按钮:
btn
-
合作伙伴:
partner
-
投票:
vote
-
左右中:
left
right
center
-
标题:
title
-
id的命名:
---
-
导航:
nav
-
主导航:
mainbav
-
子导航:
subnav
-
顶导航:
topnav
-
边导航:
sidebar
-
左导航:
leftsidebar
-
右导航:
rightsidebar
-
菜单:
menu
-
子菜单:
submenu
-
标题:
title
-
摘要:
summary
-
容器:
container
-
页头:
header
-
内容:
content
/container
-
页面主体:
main
-
页尾:
footer
-
导航:
nav
-
侧栏:
sidebar
-
栏目:
column
-
页面外围控制整体布局宽度:
wrapper
-
左右中:
left
right
center
-
页面结构
---
-
导航
-
标志:
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
的命名: -
.barnews { }
-
.barproduct { }
-
.left { float:left; }
-
.bottom { float:bottom; }
-
.font12px { font-size: 12px; }
-
.font9px {font-size: 9pt; }
-
.red { color: red; }
-
.f60 { color: #f60; }
-
.ff8600 { color: #ff8600; }
-
颜色:使用颜色的名称或者16进制代码,如
-
字体大小,直接使用"font+字体大小"作为名称,如
-
对齐样式,使用对齐目标的英文名称,如
-
标题栏样式,使用"类别+功能"的方式命名,如
---
-
注意事项::
-
一律小写;
-
尽量用英文;
-
不加中杠和下划线;
-
尽量不缩写,除非一看就明白的单词.
---
-
推荐的
CSS
书写顺序: -
color
-
font
-
text-decoration
-
text-align
-
vertical-align
-
white-space
-
other text
-
content
-
width
-
height
-
margin
-
padding
-
border
-
background
-
display
-
list-style
-
position
-
float
-
clear
-
显示属性
-
自身属性
-
文本属性