html 常见命名

常见命名
.wrap或.wrapper--用于外侧包裹
.container或.ct--包裹容器
.header--用于头部
.body--页面 body
.footer--页面尾部
.aside、sidebar--用于侧边栏
.content--和header footer对应，用于主要内容
.navigation--导航元素
.pagination--分页
.tabs > .tab--tab切换
.breadcrumbs--导航列表、面包屑
.dropdown--下拉菜单
.article--文章
.main--用于主体
.thumbnail--头像、小图像
.media--媒体资源
.panel--面板
.tooltip--鼠标放置上去的提示
.popup--鼠标点击弹出的提示
.button、btn--按钮
.ad--广告
.subnav--二级导航
.menu--菜单
.tag--标签
.message或.notice--提示消息
.summary--摘要
.logo--logo
.search--搜索框
.login--登录
.register--注册
.username--用户名
.passwprd--密码
.banne --广告条
.copyright--版权
.modal或.dialog--弹窗

状态:
inverse--相反的
toggled--切换
switched--转换
original--起初的
initial--最初的
identified--识别
disabled--禁用
loading--加载
pending--等待
syncing--同步
default--默认

修饰:
dark--黑暗的
light--浅色的
shaded--深色阴影的
flat--平滑的
ghost--精灵
maroon--褐红色的
pale--白
intense--强烈的
twisted--扭曲的
narrow--狭窄的
wide--宽的
smooth--光滑的
separate--分离
clean--清洁的
sharp--锋利的
aligned--对齐的

元素:
pagination--分页
modal--情态动词
popup--弹出
article--文章
story--故事
flash--闪光
status--现状
state--州立
media--媒体
block--快
card-卡
teaser--挑逗
badge--徽章
label--标签
sheet--片材
poster--海报
notice--通知
record--记录
entry--入门
item--项目
figure--图
square--广场
module--模块
bar--酒吧
button--按钮
action--行动
knob--旋钮

布局:
navigation--航行
wrapper--包装器
inner--内部的
header--页眉
footer--页脚
aside--在一边
section--部分
divider--除法器
content--内容
container--容器
panel--面板
pane--窗格
construct--建造
composition--作文
spacing--间距
frame--框架