<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>块级元素和行内元素</title>
<style>
h1,h2,h3,h4,h5,h6{
color: red;
background: teal;
}
form{
background: thistle;
color: red;
}
select{
background: indianred;
color: red;
}
textarea{
background: violet;
color: red;
}
table{
background: oldlace;
color: red;
}
button{
background: blanchedalmond;
color: red;
}
hr{
color: aquamarine;
}
p{
background: tomato;
}
ol{
background: aliceblue;
color: red;
}
ul{
background: palegreen;
color: red;
}
div{
height: 200px;
width: 300px;
background: khaki;
color: red;
}
title{
background: cadetblue;
color: red;
}
label{
background: lightskyblue;
color: red;
}
span{
background: darkcyan;
}
em{
background: violet;
}
i{
background: darkolivegreen;
}
a{background: blueviolet;}
b{
background: chocolate;
}
strong{
background: navy;
}
</style>
</head>
<body>
<!--常用标签
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
行内元素有：heda meat title lable span br a style em b i strong
块级元素有：body select textarea h1-h6 html table button hr p ol ul dl cnter div
-->
<!--块级元素：-->
<h1>块级元素和行内元素</h1>
<h2>块级元素和行内元素</h2>
<h3>块级元素和行内元素</h3>
<h4>块级元素和行内元素</h4>
<h5>块级元素和行内元素</h5>
<h6>块级元素和行内元素</h6>
<form>块级元素form</form>
<select>块级元素select</select>
<textarea>块级元textarea</textarea>
<table>块级元素table</table>
<button>块级元素button</button>
<hr />
<p>块级元素p</p>
<ol>
<li>块级元素ol</li>
</ol>
<ul>
<li>块级元素ul</li>
</ul>
<div>块级元素div</div>
<!--行内元素：-->
<title>行内元素title</title>
<label>行内元素label</label>
<span>行内元素span</span>
<br />
<a>行内元素a</a>
<em>行内元素em</em>
<b>行内元素b</b>
<i>行内元素i</i>
<strong>行内元素strong</strong>
</body>
</html>
