CSS的class与id常用的命名规则

网页公共命名：

#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 – – 服务
#regsiter – – 注册
arr/arrow – – 箭头
#guild – – 指南
#sitemap – – 网站地图
#list – – 列表
#homeepage – – 首页
#subpage – – 二级页面子页面
#tool，#toolbar – – 工具条
#drop – – 下拉
#dorpmenu – – 下拉菜单
#status – – 状态
#scroll – – 滚动
.tab – – 标签页
.left,.right,.center – – 居中、左、右
.news – – 新闻
.download – – 下载
.banner – – 广告条（顶部广告条）
电子贸易相关：
.products – – 产品
.products_prices – – 产品价格
.products_description – – 产品描述
.products_review – – 产品评论
.editor_review – – 编辑评论
.news_release – – 最新产品
.publisher – – 生产商
.screenshot – – 缩略图
.faqs – – 常见问题
.keyword – – 关键词
.blog – – 博客
.forum – – 论坛

基础的命名：

外套 wrap – – 用于最外层
头部 header – – 用于头部
主要内容 main – – 用于主体内容（中部）
左侧 main-left – – 左侧布局
右侧 main-right – – 右侧布局
导航条 nav – – 网页菜单导航条
内容 content – – 用于网页中部主体
底部 footer – – 用于底部

css文件命名：

master.css,style.css – – 主要的
module.css – – 模块
base.css – – 基本共用
layout.css – – 布局，版面
themes.css – – 主题
columns.css – – 专栏
font.css – – 文字、字体
forms.css – – 表单
mend.css – – 补丁
print.css – – 打印

命名建议：

无论是使用”.”(小写句号)选择符开头命名，还是使用”#”(井号)选择符号开头命名，我们最后都遵循，主要的，重要的，特殊的，最外层的盒子用“#”（井号）选择符号开头命名，其他都用”.”(小写句号)开头命名，同时考虑命名的css选择器在html中重复使用调用。

到此这篇关于css的class与id常用的命名规则的文章就介绍到这了,更多相关css class与id命名规则内容请搜索www.887551.com以前的文章或继续浏览下面的相关文章，希望大家以后多多支持www.887551.com！

黄山市民网：https://www.huangshanshimin.com/