变量命名

项目 project

产品 product

状态 status

常见 css class关键词:

  • 布局类:header, footer, container, main, content, aside, page, section

  • 包裹类:wrap, inner

  • 区块类:region, block, box

  • 结构类:hd, bd, ft, top, bottom, left, right, middle, col, row, grid, span

  • 列表类:list, item, field

  • 主次类:primary, secondary, sub, minor

  • 大小类:s, m, l, xl, large, small

  • 状态类:active, current, checked, hover, fail, success, warn, error, on, off

  • 导航类:nav, prev, next, breadcrumb, forward, back, indicator, paging, first, last

  • 交互类:tips, alert, modal, pop, panel, tabs, accordion, slide, scroll, overlay,

  • 星级类:rate, star

  • 分割类:group, seperate, divider

  • 等分类:full, half, third, quarter

  • 表格类:table, tr, td, cell, row

  • 图片类:img, thumbnail, original, album, gallery

  • 语言类:cn, en

  • 论坛类:forum, bbs, topic, post

  • 方向类:up, down, left, right

  • 其他语义类:btn, close, ok, cancel, switch; link, title, info, intro, more, icon; form, label, search, contact, phone, date, email, user; view, loading…

原文地址:https://www.cnblogs.com/lifeisshort/p/4943491.html