首页 前端知识 class命名(及前端命名)

class命名(及前端命名)

2024-09-18 02:09:20 前端知识 前端哥 772 40 我要收藏

常见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...
  • 例如:text改为txt、delete改为del,这里针对单个单词组合命名,对词组单词的组合建议不使用缩写或简写

</

单词

缩写

说明

bottom

btm

底部

button

btn

按钮

background

bg

背景

content

cont

内容

check

chk

选择框

current

curr

当前的

delete

del

删除

text

txt

文本

disabled

dis

禁用

foot

ft

底部

head

hd

头部

hidden

hide

隐藏

input

inp

input框

image

img

图片

index

idx

索引

message

msg

消息

password

pwd

密码

previous

prev

前面的、上一面

radio

rad

单选

转载请注明出处或者链接地址:https://www.qianduange.cn//article/18401.html
标签
评论
发布的文章

Excel-to-JSON开源项目指南

2024-10-27 22:10:41

json字符串, string转json

2024-10-27 22:10:16

【开源】APIJSON 框架

2024-10-27 22:10:15

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!