<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<!-- 一、按元素
black（塊元素）:div p ul ol li h1-h6 dl dt dd form table
獨占一行
支援所有樣式
不寫寬的時候，跟父元素寬相同
所占區域一個矩形（行）
inline(内聯)：span，a，em，strong，img。hr
挨在一行
有些樣式不支援：width，height，margin，padding
不寫寬，寬度由内容決定
所占區域不一定是矩形（行）
内聯标簽之間有空隙，原因：換行産生的
inline-block：input，select，iframe
挨在一起，支援寬度
注意：布局一般使用塊标簽，修飾一般用内聯标簽
二、按内容
flow：流内容（标簽）
Metadata：中繼資料（如：meta，title，heda等編碼）
Sectioning：分區（後面在講）
Heading：标題（如：h1-h6）
phrasing:措辭（如：span）
Embedded:嵌入（如：圖檔，音頻/視訊，imframe）
Interactive：互動的（輸入框）
三、 按顯示
替換元素：浏覽器根據元素的标簽和屬性，來決定元素具體顯示内容
如：img，input，form等
非替換元素：：将内哦那個告訴浏覽器，将其顯示出來
如：div，h1-h6.p，span等 -->
<style>
span{
background-color: #FF0000;
}
em{
background-color: #0000FF;
}
</style>
</head>
<body>
<div>塊元素</div>
<span>内聯元素</span>
<em>内聯元素2</em>
<input type="text" placeholder="内聯塊元素"/>
<dl>
<dt>1</dt>
<dd>2</dd>
</dl>
<form>
<input type="password" placeholder="請輸入"/>
<input type="text" />
</form>
<form>
<input type="password" placeholder="請輸入"/>
<input type="text" />
</form>
<a href="#">1</a>
<a href="#">2</a>
<iframe>1</iframe>
<iframe>2</iframe>
<hr />
<hr />
</body>
</html>
![Spring MVC 自學雜記（五） -- SpringMVC與前台的json資料互動[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)