这篇文章算是很基础的了。旨在介绍如何保证页面代码的整洁、以维护性。使用有语义的页面标签，减少标签的滥用。

1. 移除不必要的<div>标签

嵌套在<form><ul>外面的标签没有必要

例子：

2. 使用有语义的标记

<h1><ul><p>等标签，替代<div>，即便样式表丢失，仍然保证页面的可读性。

3. 尽量少的使用<div>标签

4. 代码缩进格式

5. 在</div>结尾处加上这个<div>块的注释

转：http://www.ghugo.com/coding-clean-and-semantic-templates/

扩展阅读：http://webdesignerwall.com/tutorials/coding-clean-and-semantic-templates

不要滥用div,保持代码的整洁的更多相关文章

  1. 【转】css布局居中和CSS内容居中区别和对应DIV CSS代码

    原文地址:http://www.divcss5.com/jiqiao/j771.shtml css布局居中和CSS内容居中区别和对应DIV CSS代码教程与图文代码案例篇 对于新手来说DIV CSS布 ...

  2. 【转】一个DIV+CSS代码布局的简单导航条

    原文地址:http://www.divcss5.com/shili/s731.shtml 简单的DIV CSS代码布局实现导航条 一个蓝色主题的导航条布局案例,本CSS小实例,采用DIV CSS实现. ...

  3. 【转】div居中代码 DIV水平居中显示CSS代码

    原文地址:http://www.divcss5.com/rumen/r622.shtml 如何使用CSS让DIV居中显示,让div水平居中有哪些CSS样式呢? 需要的主要css代码有两个,一个为tex ...

  4. div均匀分布代码实例

    多个div在同一行以相同间隔分布: 这样的布局效果使用非常的频繁,也就是让多个div在一行分布,并且div于div之间的间隙是一样的,多用在对于产品的展示之用,下面就介绍一下如何实现此中布局,代码实例 ...

  5. fixedBox固定div漂浮代码 支持ie6以上大部分浏览器

    fixedBox固定div漂浮代码 支持ie6以上大部分浏览器 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//E ...

  6. window.print打印指定div实例代码

    window.print可以打印网页,但有时候我们只希望打印特定控件或内容,怎么办呢,请看下面的例子 首先我们可以把要打印的内容放在div中,然后用下面的代码进行打印. 复制代码代码如下: <h ...

  7. 弹出DIV锁定代码

    <html>  <head>  <meta http-equiv="Content-Type" content="text/html; ch ...

  8. css两个form不换行，两个div并排代码

    1.form不换行通过table布局实现 <table> <tr> <td> <form method="get" action=&quo ...

  9. 2018.3.29 DIV位置调整代码

    <!DOCTYPE html><html>    <head>        <meta charset="UTF-8">      ...

随机推荐

  1. hdu 1527（威佐夫博奕）

    题意:容易理解. 分析:威佐夫博奕的模板题. 代码实现: #include<stdio.h> #include<string.h> #include<math.h> ...

  2. .NET下用C#实现邮箱激活功能

    最近要用到安全邮箱激活的功能,故写篇博客记录下. 思路:在表中增加一个字段State来记录邮箱是否激活(0激活,1未激活.) 1.发送邮件.     1-1,给邮箱发送邮件.内容:激活地址+GUID. ...

  3. Nginx gzip配置详解

    gzip决定是否开启gzip模块param:on|offexample:gzip on; gzip_buffers 设置gzip申请内存的大小,其作用是按块大小的倍数申请内存空间param1:intp ...

  4. iframe根据子页面自动调整大小

    //iframe高度自适应 function IFrameReSize(iframename) { var pTar = document.getElementById(iframename); if ...

  5. 渗透测试实例Windows XP SP2

    一.msf> use exploit/windows/dcerpc/ms03_026_dcom.看到命令提示符的改变表明该命令已经运行成功. 二.为漏洞利用代码设置必要的参数,show opti ...

  6. 理解KMP

    KMP字符串模式匹配通俗点说就是一种在一个字符串中定位另一个串的高效算法.简单匹配算法的时间复杂度为O(m*n),KMP匹配算法,可以证明它的时间复杂度为O(m+n).. 一.简单匹配算法 先来看一个 ...

  7. BitmapData类介绍

    今天介绍另外一个比较常用和中高级难度的类:BitmapData 用好这个类,可以说是半支脚踏入了Flash高手的大门···(主要是不是太多的人精通这个··呵呵··)我也可以趁这篇文章的机会好好巩固+学 ...

  8. Java的位运算符—— 与（&）、非（~）、或（|）、异或（^）

    位运算符主要针对二进制,它包括了:“与”.“非”.“或”.“异或”.从表面上看似乎有点像逻辑运算符,但逻辑运算符是针对两个关系运算符来进行逻辑运算,而位运算符主要针对两个二进制数的位进行逻辑运算.下面 ...

  9. WSARecv()

    简述:从一个套接口接收数据. #include <winsock2.h> int WSAAPI WSARecv ( SOCKET s, LPWSABUF lpBuffers, DWORD ...

  10. WEB数据挖掘（十六）——Aperture数据抽取（9）：数据源

    One of the central concepts of Aperture is the notion of a DataSource. A DataSource contains all inf ...