id和class命名规范

id和class命名规范

• 外套 wrap

• 容器 container

• 内容 content

• 顶部 top

• 头部 header

• 底部 footer

• 导航 nav

• 导航条 navBar

• 主导航 mainNav

• 子导航 subNav

• 顶导航 topNav

• 标题 title

• 左 left

• 右 right

• 中 center

• 上 up

• 下 down

• 幻灯片 banner

• 轮播 slider

• 面包屑 breadCrumb

• 登录 login

• 注册 reg

• 用户 user

• 提示信息 msg

• 新闻 news

• 列表 list

• 版权 copyright

• 详情 view

• 项目 item

• 更多 more

• 电话 tel

• 邮箱 email

• 选项卡 tab

• 头像 avatar

• 文章 artical

• 图集 gallery

• 条栏 bar

• 关闭 close

• 箭头 arrow

• 向左一个 prev

• 向右一个 next

• 页面、页码 page

• 图标 icon

• 标识 logo

• 菜单 menu

• 相片 photo

• 播放 play

• 快捷 quick

• 侧边栏 slider

• 返回 back

• 搜索 search

• 面板 panel

• 不固定 fluid

• 分享 share

• 加载 loading

• 数字 num

• 首页 index

• 关于 about

• 服务 service

• 产品 product

• 联系 contact

文本命名规范
index.css： 一般用于首页建立样式
head.css： 头部样式，当多个页面头部设计风格相同时使用。
base.css： 共用样式。
style.css：独立页面所使用的样式文件。
global.css：页面样式基础，全局公用样式，页面中必须包含。
layout.css：布局、版面样式，公用类型较多时使用，一般用在首页级页面和产品类页面中
module.css：模块，用于产品类页，也可与其它样式配合使用。
master.css：主要的样式表
columns.css：专栏样式
themes.css：主体样式
forms.css：表单样式
mend.css：补丁，基于以上样式进行的私有化修补。
页面结构命名：
page：代表整个页面，用于最外层。
wrap：外套，将所有元素包在一起的一个外围包，用于最外层
wrapper：页面外围控制整体布局宽度，用于最外层
container：一个整体容器，用于最外层
head，header：页头区域，用于头部
nav: 导航条
content：内容，网站中最重要的内容区域，用于网页中部主体
main：网站中的主要区域（表示最重要的一块位置），用于中部主体内容
column：栏目
sidebar：侧栏
foot，footer：页尾、页脚。网站一些附加信息放置区域，（或命名为 copyright）用于底部
导航命名：
nav, navbar, navigation, nav-wrapper：导航条或导航包，代表横向导航
topnav：顶部导航
mainbav：主导航
subnav：子导航
sidebar：边导航
leftsidebar 或 sidebar_a：左导航
rightsidebar 或 sidebar_b：右导航
title：标题
summary：摘要
menu：菜单，区域包含一般的链接和菜单
submenu：子菜单
drop：下拉
dorpmenu：下拉菜单
links：链接菜单
功能命名：
logo：标记网站logo标志
banner：标语、广告条、顶部广告条
login：登陆，（例如登录表单：form-login）
loginbar：登录条
register：注册
tool, toolbar：工具条
search：搜索
searchbar：搜索条
searchlnput：搜索输入框
shop：功能区，表示现在的
icon：小图标
label：商标
homepage：首页
subpage：二级页面子页面
hot：热门热点
list：文章列表，（例如：新闻列表：list-news）
scroll：滚动
tab：标签
sitemap：网站地图
msg 或 message：提示信息
current：当前的
joinus：加入
status：状态
btn：按钮，（例如：搜索按钮可写成：btn-search）
tips：小技巧
note：注释
guild：指南
arr, arrow：标记箭头
service：服务
breadcrumb：(即页面所处位置导航提示）
download：下载
vote：投票
siteinfo：网站信息
partner：合作伙伴
link, friendlink：友情链接
copyright：版权信息
siteinfoCredits：信誉
siteinfoLegal：法律信息