#cnblogs_post_body ol {
padding-left: 0px;
}
body {
line-height: 1.6;
}
body, th, td, button, input, select, textarea {
font-family: \5fae\8f6f\96c5\9ed1,arial;
_font-family: arial,\5b8b\4f53;
font-size: 13px;
color: #333;
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
}
table {
width: 100%;
empty-cells: show;
background-color: transparent;
border-spacing: 0;
}
.table-bordered {
border: 1px solid #ddd;
border-collapse: separate;
border-left: 0;
}
.table-bordered th, .table-bordered td {
border-left: 1px solid #ddd;
}
.table td {
text-align: left;
}
.label-important, .badge-important {
background-color: #b94a48;
}
.label, .badge {
display: inline-block;
padding: 2px 4px;
font-size: 11.844px;
font-weight: bold;
line-height: 14px;
color: #fff;
text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
white-space: nowrap;
vertical-align: baseline;
}
.label {
border-radius: 3px;
}
.prettyprint {
padding: 8px;
background-color: #f7f7f9;
border: 1px solid #e1e1e8;
}
pre {
display: block;
padding: 9.5px;
margin-bottom: 10px;
font-size: 14px;
line-height: 20px;
word-break: break-all;
word-wrap: break-word;
white-space: pre-wrap;
border-radius: 4px;
color: #333;
}
pre .tag {
color: #007;
}
pre .value, pre .tag .value {
color: #d14;
}
code, pre {
font-family: monaco,menlo,consolas,"Courier New",monospace;
}
.pl-20 {
padding-left: 20px;
}
.prettyprint.linenums {
box-shadow: inset 40px 0 0 #fbfbfc,inset 41px 0 0 #ececf0;
}
pre ol.linenums {
list-style: decimal outside none;
margin: 0 0 0 33px;
}
pre ol.linenums li {
padding-left: 12px;
color: #bbb;
line-height: 18px;
text-shadow: 0 1px 0 #fff;
}
pre .attr {
color: #088;
}

1、推荐使用html5的文档声明

  1. <!DOCTYPE HTML>

2、必须申明文档的编码charset，且与文件本身编码保持一致，推荐使用UTF-8编码

  1. <meta charset="utf-8">

3、title 不可缺少，控制在25个字、50个字节以内。“二级栏目 - 一级栏目 - 网站名称”。

4、keywords很重要，关键词，针对SEO。

注意： 5个左右,单个8汉字以内；禁忌堆砌，与网站主题无关。

5、description网站描述，字数尽量空制在80个汉字，160个字符以内

6、采用栅格化处理，常用980栅格，1000栅格

7、书写注释，方便程序开发嵌套。注释方式：

开始注释：<!-- 注释 -->

结束注释：<!-- /注释文案 -->

允许只有开始注释

注意： 浮动的地方不要加注释，可能导致布局错位或文字的BUG。

8、img添加alt属性，增加可访问性。

  1. <img src="" alt="图片描述" title="图片描述">

9、带有实体名称的 ASCII 实体或特殊字符要使用实体名。

注意： 实体名称对大小写敏感。

字符 名称 实体名
¥ 人民币符号：元 &yen;
© 版权 &copy;
® 注册商标 &reg;
™ 商标TM &trade;
· 间隔符号 &middot;
" 双引号 &quot;
& &符 &amp;
< 左尖括号（小于号） &lt;
> 右尖括号（大于号） &gt;
  半角空格 &nbsp;
× 乘号 &times;
÷ 除号 &divide;

10、标签一定要正确嵌套，标签一定要闭合。

11、用div等标签布局；表格型数据，table首选。

12、代码风格采用树形结构，提高可读性；避免冗余嵌套。

13、模块之间必须保持独立，区块化布局，方便随意增删改，多人协作维护。

下面给出html模版：

  1. <!DOCTYPE HTML>

  2. <html>

  3. <head>

  4. <meta charset="utf-8">

  5. <meta http-equiv="X-UA-Compatible" content="IE=edge" />

  6. <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />

  7. <title>网站标题，控制在25个字、50个字节以内</title>

  8. <meta name="keywords" content="关键词,5个左右,单个8汉字以内">

  9. <meta name="description" content="网站描述，字数尽量空制在80个汉字，160个字符以内！">

  10. <!--[if lt IE 9]>

  11. <script type="text/javascript" src="plug/html5.js"></script>

  12. <![endif]-->

  13. <link href="templates/lfsp/css/lfsp.css" rel="stylesheet" type="text/css" />

  14. <link href="templates/lfsp/css/style.css" rel="stylesheet" type="text/css" /><!--自己的样式-->

  15. <!--[if IE 6]>

  16. <script type="text/javascript" src="plug/DD_belatedPNG_0.0.8a-min.js" ></script>

  17. <script>DD_belatedPNG.fix('.pngfix,.icon');</script>

  18. <![endif]-->

  19. </head>

  20. <body>

  21. <header>网站头部</header>

  22. <div>内容部分</div>

  23. <footer>页脚</footer>

  24. <script type="text/javascript" src="plug/jquery.min.js"></script>

  25. <script type="text/javascript" src="templates/lfsp/lfsp.js"></script>

  26. </body>

  27. </html>

<参考：http://lfsp.btwlo.com/htmlStructure.html>

Html书写规范的更多相关文章

  1. CSS书写规范、命名规范、网易CSS框架NEC

    网易CSS框架NEC:http://nec.netease.com/ NEC框架的CSS规范:  CSS规范 - 分类方法 CSS规范 - 命名规则 CSS规范 - 代码格式 CSS规范 - 优化方案 ...

  2. html和css书写规范

    HTML 规范 分离的标记.样式和脚本 结构.表现.行为分离 在可能情况下验证你的标记 使用编辑器验证你的标记是否正确,一般编辑器都自带有这个功能. 技术不支持的时候使用备胎,如canvas 编码格式 ...

  3. 数据库DDL语句书写规范

    数据库DDL语句书写规范 1.SQL语句编写说明编写SQL语句应遵循统一的规范,包括大小写.空格.换行.缩进等等,只有完全一样的SQL才能在数据库中共享,从而减少硬解析. 字段类型.长度:根据数据情况 ...

  4. CSS书写规范

    一.CSS书写顺序 1.位置属性(position,top,right,z-index,display,float等) 2.大小(width,height,padding,margin) 3.文字系列 ...

  5. 推荐大家使用的CSS书写规范、顺序

    写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经 ...

  6. 分享给大家的CSS书写规范、顺序

    写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经 ...

  7. css命名书写规范小结。

    单行形式书写风格的排版约束 1.   每一条规则的大括号 { 前后加空格 2.   多个selector共用一个样式集,则多个selector必须写成多行形式 3.   每一条规则结束的大括号 } 前 ...

  8. CSS书写规范及顺序

    CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3. ...

  9. [Java拾遗一] XML的书写规范与解析.

    前言今天天气大好, 起了个大早开始总结一些常用的基础知识. XML一直来说都很陌生, 使用大多是用于配置文件, 之前并没有细究过其中的约束规范, 今天刚好没事来学习并总结下. 1,XML基础介绍 XM ...

  10. JAVA书写规范

    java程序书写规范 命名规范    1.一般概念        1.尽量使用完整的英文描述符        2.采用适用于相关领域的术语        3.采用大小写混合使名字可读        4 ...

随机推荐

  1. Linux fork()、exec() Hook Risk、Design-Principle In Multi-Threadeed Program

    目录 . Linux exec指令执行监控Hook方案 . 在"Multi-Threadeed Program"环境中调用fork存在的风险 . Fork When Multi-T ...

  2. C#实现 Eval

    主要是使用 CSharpCodeProvider,动态调用来进行返回. 首先会拼接成一个类的一个方法,然后返回这个方法的值.不过,因为还是使用反射,所以效率不高. public static clas ...

  3. Beta版本——第五次冲刺博客

    我说的都队 031402304 陈燊 031402342 许玲玲 031402337 胡心颖 03140241 王婷婷 031402203 陈齐民 031402209 黄伟炜 031402233 郑扬 ...

  4. 【Beta版本】冲刺-Day1

    队伍:606notconnected 会议时间:12月9日 目录 一.行与思 二.站立式会议图片 三.燃尽图 四.代码Check-in 一.行与思 张斯巍(433) 今日进展:git学习,xml语言学 ...

  5. 【Alpha版本】冲刺-Day6

    队伍:606notconnected 会议时间:11月14日 会议总结 张斯巍(433) 今天安排:学习UI设计 完成度:100% 明天计划:上传界面设计 遇到的问题:无 感想:刚开始学的时候,都是从 ...

  6. 2015年10月份经常使用的linux命令。

    ps -ef |grep  服务名         详细的介绍可以参考此篇博客http://www.cnblogs.com/wangkangluo1/archive/2011/09/23/218593 ...

  7. 给linux添加yum源。

    在玩linux的过程中,经常会下载一些源码包.软件大多是国外人写的,由于众所周知的原因,网络下载很慢. 所以想到了更新yum源的方法. 我的linux版本是CentOS6.3的. 以下参考百度. 1, ...

  8. javascript之标识（zhi）符、关键字与保留字

    正确区分标识(zhi)符.关键字与保留字 我发现很多初学者往往弄不清楚这三者的区别,甚至会把标识符的“识(zhi)”读作识(shi),真是愧对小学的语文老师啊!!! 注意:在JavaScript中,所 ...

  9. BZOJ3685: 普通van Emde Boas树

    显然这题的所有操作都可以用set,但是直接用set肯定要T,考虑到读入量较大,使用fread读入优化,就可以卡过去了. #include<bits/stdc++.h> using name ...

  10. Linux常用服务部署与优化之NFS篇

    NFS(network file system)的简称,是linux系统之间常用的一种文件共享方式,下面简述其搭建过程,需要两个linux系统的虚拟机,假设客户端的ip为192.168.1.105,服 ...