阅读量:0
CSS命名应遵循可读性、一致性和简洁性原则，通常使用小写字母和下划线分隔单词。
CSS命名参考
1、命名规则说明：
所有的命名最好都小写。
属性的值一定要用双引号("")括起来，且一定要有值，例如class="divcss5"。
每个标签都要有开始和结束，且要有正确的层次，排版有规律工整。
空元素要有结束的tag或于开始的tag后加上"/"。
表现与结构完全分离，代码中不涉及任何的表现元素，如style、font、bgColor、border等。
<h1>到<h5>的定义，应遵循从大到小的原则，体现文档的结构，并有利于搜索引擎的查询。
给每一个表格和表单加上一个唯一的、结构标记id。
给图片加上alt标签。
尽量使用英文命名原则。
尽量不缩写，除非一看就明白的单词。
2、相对网页外层重要部分CSS样式命名：
外套 wrap 用于最外层。
头部 header 用于头部。
主要内容 main/content 用于主体内容（中部）。
左侧 main-left 左侧布局。
右侧 main-right 右侧布局。
导航条 nav 网页菜单导航条。
内容 content 用于网页中部主体。
底部 footer 用于底部。
3、DIV+CSS命名参考表：
CSS样式命名
页面外围控制整体布局宽度 #wrapper。
容器,用于最外层 #container或#content。
布局 #layout。
页头部分 #head, #header。
页脚部分 #foot, #footer。
主导航 #nav。
二级导航 #subnav。
菜单 #menu。
子菜单 #submenu。
侧栏 #sideBar。
左边栏或右边栏 #sidebar_a, #sidebar_b。
页面主体 #main。
标签 #tag。
提示信息 #msg #message。
小技巧 #tips。
投票 #vote。
友情连接 #friendlink。
标题 #title。
#summary。
登录条 #loginbar。
搜索输入框 #searchInput。
热门热点 #hot。
搜索 #search。
搜索输出和搜索结果相似 #search_output。
搜索条 #searchBar。
搜索结果 #search_results。
版权信息 #copyright。
商标 #branding。
网站LOGO标志 #logo。
网站信息 #siteinfo。
法律声明 #siteinfoLegal。
信誉 #siteinfoCredits。
加入我们 #joinus。
合作伙伴 #partner。
服务 #service。
注册 arr/arrow 箭头。
指南 #guild。
网站地图 #sitemap。
列表 #list。
首页 #homepage。
二级页面子页面 #subpage。
工具条 #tool, #toolbar。
下拉 #drop。
下拉菜单 #dorpmenu。
状态 #status。
滚动 .tab 标签页 .left .right .center 居左、中、右 .news 新闻 .download 下载 .banner 广告条(顶部广告条)。
CSS文件命名
主要的 master.css,style.css。
模块 module.css。
基本共用 base.css。
布局，版面 layout.css。
主题 themes.css。
专栏 columns.css。
文字、字体 font.css。
表单 forms.css。
补丁 mend.css。
打印 print.css。
相关问题与解答
1、问题一：在CSS中，为什么推荐所有的命名都使用小写？
答案：使用小写可以保证CSS命名的一致性和可读性，避免因大小写不同而引起的混淆，大多数CSS属性名都是小写的，保持命名习惯的统一有助于提高代码的整洁度。
2、问题二：在团队合作中，如何确保CSS命名的一致性？
答案：为了确保CSS命名的一致性，团队可以制定一套统一的CSS命名规范，并在项目开始前进行讨论和确认，可以使用代码审查工具来检查团队成员提交的代码，确保其符合命名规范，团队成员之间可以通过定期交流和分享经验来共同提高对CSS命名规范的理解和遵守程度。
小伙伴们，上文介绍了“CSS教程:CSS命名参考”的内容，你了解清楚吗？希望对你有所帮助，任何问题可以给我留言，让我们下期再见吧。
