编写CSS代码时样式的命名规则

ttx9n · 发表于 2009-9-9 00:13:53

命名一直是个让我头痛的问题，特别是那些看上去差不多的模块，所以就得想办法啦，我总结了下面的方法，虽然还在试验中。希望对大家有帮助。欢迎大家提出改进的意见。具体如下：

要注意的内容：
一，命名所选用的单词应选择不过于具体表示某一状态（如颜色、字号大小等）的单词，以避免当状态改变时名称失去意义。
二，样式类名由以字母开头的小写字母（a-z）、数字（0-9）、下划线（_）、减号（-）组成。
ID名称由不以数字开头的小写字母（a-z）、数字（0-9）、下划线（_）组成。

可使用类似下面的规则:

[模块前缀|类型|作用]_[名称]_[状态|位置]
约定模块、类型、状态、位置等的所使用的单词或其缩写，保持上面的顺序，尽量保持在两到三个单词说清用途。

例：
通用名词缩写
设置 set
成功 suc
提示 hint
操作 op
密码 pw
菜单 menu
按钮 bt
文本 tx
颜色 c
背景 bg
边框 bor
居中 center
图标 icon
弹出 pop

文本输入框 .input_tx
密码输入框 .input_pw
登录密码输入框 .input_pw_login
日志设置成功提示 .hint_suc_blogset
相册弹出的设置层 .pop_set_photo
公共提示 .hint_bg
文本颜色 .c_tx
段落文本颜色 .c_tx_p

lsc54 · 发表于 2022-8-17 02:37:44

谢谢楼主分享

JosephSA · 发表于 2022-9-20 18:12:57

啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦

JosephSA · 发表于 2022-11-7 01:15:25

挺不错的东西

3pjdk29w · 发表于 2023-4-1 09:47:39

66666666666666666666

sykzus · 发表于 2023-9-12 04:49:08

谢谢下载来看看

a75620618 · 发表于 2023-12-5 18:27:45

天天源码论坛

7jbiiz · 发表于 2024-3-13 05:54:41

看看怎么样再说

360784533 · 发表于 2024-3-17 06:05:30

还有什么好东西没

360784533 · 发表于 2024-6-15 12:57:55

呵呵呵呵呵呵呵a

账号		自动登录	找回密码
密码			立即注册

[CSS] 编写CSS代码时样式的命名规则

相关帖子