一.HTML中的三種佈局方式
1.標準流:默認的佈局方式,即順序佈局
2.浮動:
3.定位:position屬性決定了元素將如何定位
二.HTML有兩大元素
1.塊級元素
div, h1~h6, 有序無序列表(ol,ul,li), table表格 p段落等--總是獨佔一行
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>標準流網頁佈局</title>
<style>
.test{
width: 100px;
height: 100px;
background: red;
border: 1px solid #FFFFFF;/*邊框1像素實線白色*/
}
</style>
</head>
<body>
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
<span>文字1</span>
<span>文字3</span>
<span>文字2</span> <!--div垂直排列,span橫向排列---即塊元素和內聯元素的區別-->
</body
</html>
2.內聯元素
a, span, img ,input--和相鄰的內聯元素同一行,寬度不夠纔會被擠到下一行。