去除body样式默认边框
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>无标题文档</title>
<style>
body{margin:0;}//去除body样式中默认的8px外边框
body{border:1px solid red;}
</style>
</head>
<body>
<a href="#">a标签（链接，下载，锚点）</a>
<img src="1.png" alt="猫咪"/>
<a href="#"><img src="1.png" alt="猫咪"/></a>
<span>区分样式</span>
<strong>强调(粗体)</strong>
<em>强调(斜体)</em>
<p>段落</p>
<div>块</div>
<ol>
<li>列表1</li>
<li>列表2</li>
<li>列表2</li>
</ol>
<ul>
<li>列表1</li>
<li>列表2</li>
<li>列表2</li>
</ul>
<dl>
<dt>
定义列表标题
</dt>
<dd>定义列表项1</dd>
<dd>定义列表项2</dd>
<dd>定义列表项3</dd>
</dl>
</body>
</html>默认的body样式（注意外边框）：
去除外边框的body样式：
通过群组样式将边框去除
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>无标题文档</title>
<style>
body,p,h1,h2{margin:0;}//通过群组样式将标签默认边框去除
body{border:1px solid red;}
</style>
</head>
<body>
<a href="#">a标签（链接，下载，锚点）</a>
<img src="1.png" alt="猫咪"/>
<a href="#"><img src="1.png" alt="猫咪"/></a>
<span>区分样式</span>
<strong>强调(粗体)</strong>
<em>强调(斜体)</em>
<p>段落</p>
<div>块</div>
<h1>标题1</h1>
<h2>标题2</h2>
<ol>
<li>列表1</li>
<li>列表2</li>
<li>列表2</li>
</ol>
<ul>
<li>列表1</li>
<li>列表2</li>
<li>列表2</li>
</ul>
<dl>
<dt>
定义列表标题
</dt>
<dd>定义列表项1</dd>
<dd>定义列表项2</dd>
<dd>定义列表项3</dd>
</dl>
</body>
</html>清除ol、ul的默认样式
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>无标题文档</title>
<style>
body,p,h1,h2{margin:0;}
body{border:1px solid red;}
ol,ul{list-style:none;}//清除列表项
</style>
</head>
<body>
<ol>
<li>列表1</li>
<li>列表2</li>
<li>列表2</li>
</ol>
<ul>
<li>列表1</li>
<li>列表2</li>
<li>列表2</li>
</ul>
<a href="#">a标签（链接，下载，锚点）</a>
<img src="1.png" alt="猫咪"/>
<a href="#"><img src="1.png" alt="猫咪"/></a>
<span>区分样式</span>
<strong>强调(粗体)</strong>
<em>强调(斜体)</em>
<p>段落</p>
<div>块</div>
<h1>标题1</h1>
<h2>标题2</h2>
<dl>
<dt>
定义列表标题
</dt>
<dd>定义列表项1</dd>
<dd>定义列表项2</dd>
<dd>定义列表项3</dd>
</dl>
</body>
</html>清除样式后：
去除a标签默认的文本修饰
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>无标题文档</title>
<style>
body,p,h1,h2{margin:0;}
body{border:1px solid red;}
ol,ul{list-style:none;}//清除列表项
a{text-decoration:none;}//清除a标签默认的文本修饰
</style>
</head>
<body>
<a href="#">a标签（链接，下载，锚点）</a>
<ol>
<li>列表1</li>
<li>列表2</li>
<li>列表2</li>
</ol>
<ul>
<li>列表1</li>
<li>列表2</li>
<li>列表2</li>
</ul>
<img src="1.png" alt="猫咪"/>
<a href="#"><img src="1.png" alt="猫咪"/></a>
<span>区分样式</span>
<strong>强调(粗体)</strong>
<em>强调(斜体)</em>
<p>段落</p>
<div>块</div>
<h1>标题1</h1>
<h2>标题2</h2>
<dl>
<dt>
定义列表标题
</dt>
<dd>定义列表项1</dd>
<dd>定义列表项2</dd>
<dd>定义列表项3</dd>
</dl>
</body>
</html>效果：
