html字号齐代码,Html5+CSS3命名规范(前端web开发命名规范,符合SEO规范)

任何代码编程都有各自特点的常用命名规范,div+css页面设计也不例外。遵守常用的css命名规范有利于代码的升级和扩展,也有利于让别人读懂你的css代码,让你的页面显得清晰有条理。

11947b8348f4674905edd2f4c0d34261.png

css文件名命名规范模块:module.css

基本共用:base.css

布局、版面:layout.css

主题:themes.css

专栏:columns.css

文字:font.css

表单:forms.css

补丁:mend.css

打印:print.css

页面结构元素div命名规范头:header

内容:content/container

尾:footer

导航:nav

侧栏:sidebar

栏目:column

页面外围控制整体布局宽度:wrapper

左右中:left right center

登录条:loginbar

标志:logo

广告:banner

页面主体:main

热点:hot

新闻:news

下载:download

子导航:subnav

菜单:menu

子菜单:submenu

搜索:search

友情链接:friendlink

页脚:footer

版权:copyright

滚动:scroll

内容:content

标签页:tab

文章列表:list

提示信息:msg

小技巧:tips

栏目标题:title

加入:joinus

指南:guild

服务:service

注册:regsiter

状态态:status

投票:vote

合作伙伴:partner

页面结构容器: container

页头:header

内容:content/container

页面主体:main

页尾:footer

导航:nav

侧栏:sidebar

栏目:column

页面外围控制整体布局宽度:wrapper 左右中:left right center

颜色命名-使用颜色的名称或者16进制代码.red {color: red;}

.f60 {color: #f60;}

.ff8600 {color: #ff8600;}

字体大小命名-直接使用“font+字体大小”作为名称.font12px {font-size: 12px;}

.font9pt {font-size: 9pt;}

对齐样式命名-使用对齐目标的英文名称.left {float:left;}

.bottom {float:bottom;}

标题栏样式命名-使用“类别+功能”的方式命名.barnews { }

.barproduct { }

注释书写规范

1.行间注释-直接写于属性值后面,如:.search{

border:1px solid #fff;/*定义搜索输入框边框*/

background:url(../images/icon.gif) no-report #333;/*定义搜索框的背景*/

}

2.整段注释-分别在开始及结束地方加入注释,如:/*=====搜索条=====*/

.search {

border:1px solid #fff;

background:url(../images/icon.gif) no-repeat #333;

}

/*=====搜索条结束=====*/

注意事项:

1、一律小写;

2、尽量用英文;

3、尽量不缩写,除非一看就明白的单词;

4、属性的值一定要用双引号(“”)括起来,且一定要有值如class="divcss5",id="divcss5";

5、每个标签都要有开始和结束,且要有正确的层次,排版有规律工整。

大家在日常的页面设计中要逐步养成规范命名的好习惯。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值