HTML，CSS的class与id命名规则

个人博客点这里

最重要的部分先说(命名书写格式)

常见的格式有：连接符（search-btn）、下划线、全小（searchbox）、小驼峰（searchBox）。

现在用得多广泛的还是第一种使用连接符，易读、书写方便。

在这里小编推荐大家id使用下划线_来进行连接,class用中划线-来进行连接

网页公共命名：

#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 - - 打印

原文链接

HTML，CSS的class与id命名规则相关推荐

CSS的class、id、css文件名的常用命名规则
CSS的class.id.css文件名的常用命名规则 (一)常用的CSS命名规则头:header 内容:content/container 尾:footer 导航:nav 侧栏:sid ...
web标准化设计：常用的CSS命名规则
常用的CSS命名规则头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左 ...
常用的CSS命名规则
网页设计中常用的CSS命名规则: 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wra ...
网页制作中规范使用DIV+CSS命名规则（转）
网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率,具体DIV CSS命名规则内容如下: 页头:header 如:#header{属性:属性值;}或.h ...
SEO中的DIV CSS样式的命名规则
在搜索引擎优化中,对于代码的优化是一个非常重要的部分. 如果一个网页的代码非常的简捷,对于提升网站的排名那个是非常有好处的. 同样, 在CSS样式表中,合理有序的命名同样可以为整个CSS工作带来意想不 ...
你应该了解的CSS语义化命名方式及常用命名规则
CSS语义化命名从上图我们可以大概看出这里有两种CSS的命名方式:1.结构化命名法:2.语义化命名法. 结构化命名法:根据页面中板块的位置而命名,如上图中的content-left,这时如果我们想把 ...
CSS命名规则--参考表
CSS命名规则--参考表 **************************************************** CSS命名规则 ************************** ...
html站点如何命名,html页面的CSS、DIV命名规则
68. XHTML文件中id的命名 (1)页面结构容器: container 页头:header 内容:content/container 页面主体:main 页尾:footer 导航:nav ...
史上最全的HTML和CSS标签常用命名规则
文件夹主要建立以下文件夹: 1.Images 存放一些网站常用的图片: 2.Css 存放一些CSS文件: 3.Flash 存放一些Flash文件: 4.PSD 存放一些PSD源文件: 5.Temp 存 ...

HTML，CSS的class与id命名规则

最重要的部分先说(命名书写格式)

网页公共命名：

电子贸易相关：

基础的命名：

CSS文件命名：

HTML，CSS的class与id命名规则相关推荐

最新文章

热门文章