常用的div+css常用命名简写代码示例

在css命名里我们尽量遵循 内容优先,表现为辅 原则。做到光凭名字就可以告诉其他开发者某个标记是用来干什么的。

CSS样式命名规范：
1、采用英文字母、数字以及"-"和“_”命名
2、以小写字母开头，不能以数字和“-”、“_”开头
3、命名形式：单字，连字符，下划线和驼峰
4、使用有意义命名

以下为小编常用的css命名中英文对照总结

 current  当前    
 hover    悬停    
 selected 挑选   
 disabled 禁用   
 focus    得到焦点    
 blur     失去焦点   
 checked  勾选    
 success  成功    
 error    出错
 

 header(hd)   头部   
 content(cnt) 内容   
 title(tit)   标题   
 item         项目（条）    
 cell         单元   
 image/pic(img) 图片   
 text(txt)    文字    
 top          顶部    
 scrubber     时序菜单
 content      内容    
 summary      摘要    
 time         时间
 hot          热点    
 news         新闻     
 banner/AD    广告    
 download     下载
 
 导航
 nav 导航    
 mainnav 主导航   
 subnav 子导航    
 topnav 顶部导航   
 breadcrumb 面包屑导航

 flink     友情链接    
 footer    尾    
 copyright 版权

 menu     菜单   
 submenu  子菜单   
 dropdown 下拉菜单

 searchBar  搜索条   
 search     搜索条    
 searchTxt  搜索框   
 searchBtn  搜索按钮    
 search_key 搜索词

  member 会员   ucenter 用户中心    loginBar 登陆条    login 登录    loginBtn 登录按钮   regsiter 注册按钮   btn-regsiter注册按钮    name 用户名    password 密码   nickname 昵称   mobilephone/mobile 手机    telephone/tel 电话   defaultavatar 默认头像

  hot 热点    news 新闻   banner/AD 广告    download 下载

  share 分享    digg 顶    like 喜欢

  list 列表   pList 图片列表    tList 文字列表    tpList 图文列表

  table 表格    row 行   column 列    gutter 间隔   viewport 视口

  tab 标签    tags 标签   scroll 滚动 

  sidebar 侧边栏   column 栏目   section 区块    msg 提示信息    status 状态   vote 投票   tips 小技巧    guild 指南    note 注释

  icon- 图标    btn- 按钮

  goods 商品    goodsList 商品列表    goodsDetail 商品详情    goodsInfo 商品信息

  tuan 团购   tuanList 团购列表   tuanDetail  团购详情    tuanInfo 团购信息

  transition 动画   shadow 阴影   fade 淡入淡出   flip 翻页效    slide 滑动    slideup 上滑动   slidedown 下滑动   turn 翻页   horizontal 水平   vertical 垂直   collapsible 折叠    corners 拐角    flow 流    reverse 反向    pop 弹窗

  count 总数/计数   plus 加号/正   minus 减号/负    controlgroup 控制组