1.块元素
（1）大多数 HTML 元素被定义为块级元素或内联元素。
（2）块级元素在浏览器显示时，通常会以新行来开始（和结束），比如：<h1>, <p>, <ul>, <table>
2.内联元素
（1）在显示时通常不会以新行开始，例如：<b>, <td>, <a>, <img>
3.<div>元素
（1）HTML <div> 元素是块级元素，它是可用于组合其他 HTML 元素的容器。
（2）<div> 元素没有特定的含义，除此之外，由于它属于块级元素，浏览器会在其前后显示折行。
（3）如果与 CSS 一同使用，<div> 元素可用于对大的内容块设置样式属性。
（4）<div> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 <table> 元素进行文档布局不是表格的正确用法。<table> 元素的作用是显示表格化的数据。
（5）设置 <div> 元素的类，使我们能够为相同的 <div> 元素设置相同的类。
示例代码：
<html>
<head>
</head>
<meta charset="utf-8">
<body style="background-color:green;color:white">
<!--块-div-->
<style type="text/css">
.cities{
background-color: black;
color: white;
margin: 20px;
padding: 20px;
}
</style>
<style type="text/css">
span.red{color: red;}
</style>
<h3>这是一个header</h3>
<p>This is a paragraph.</p>
<div style="color:red">
<h3>这是一个header</h3>
<p>This is a paragraph.</p>
</div>
<h1>NEWS WEBSITE</h1>
<p>some text. some text...</p>
<div class="news" id="news1">
<h2>News headline 1</h2>
<p>some text1. some text1...</p>
</div>
<div class="news" id="news2">
<h2>News headline 2</h2>
<p>some text3. some text3...</p>
</div>
</body>
</html>展示效果：
4.<span>元素
（1）HTML <span> 元素是内联元素，可用作文本的容器。
（2）<span> 元素也没有特定的含义，当与 CSS 一同使用时，<span> 元素可用于为部分文本设置样式属性。
示例代码1：
<html>
<head>
</head>
<meta charset="utf-8">
<body style="background-color:green;color:white">
<!--块-span-->
<h1>
My <span class="red">Important</span> Heading is very <span class="red">very very</span> interesting.
</h1>
</body>
</html>展示效果：
示例代码2：
<html>
<head>
</head>
<meta charset="utf-8">
<body style="background-color:green;color:white">
<!--块-span-->
<p>
<span>some text.</span>
some other text.
</p>
<div class="cities">
<h2>London</h2>
<p>
London is the capital city of England.
</p>
</div>
<div class="cities">
<h2>Paris</h2>
<p>
Paris is the capital city of France.
</p>
</div>
<div class="cities">
<h2>Beijing</h2>
<p>
Beijing is the capital city of China.
</p>
</div>
</body>
</html>
5.对 HTML 进行分类（设置类），使我们能够为元素的类定义 CSS 样式。为相同的类设置相同的样式，或者为不同的类设置不同的样式
9761
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
