text-align的center以及float的補充，text-alignfloat
對於text-align的center屬性有如下特點：
1、將text-align的center應用在一個容器上，它只是針對容器裡面的文字以及容器裡面的display為inline或者inline-block的容器，如果裡面的容器display為block，則裡面的容器不會置中
2、text-align具有向下傳遞性，會不斷向子項目傳遞
<style>.div1{text-align:center;width:100%;height:200px;background:#9F0;}.div2{display:block;width:200px;height:50px;background:#00F;}span{display:inline-block;height:100px;background:#0F0;}h1{display:inline;background:#F00;}</style><body><div class="div1"><h1>我是中心</h1><div><div class="div2">第三個中心</div></div><span>這是中心</span></div></body>
藍色和紅色對比說明center可作用於display為inline的元素，但不能作用於display為block的元素
藍色與綠色對比說明center可作用於display為inline-block的元素，但不能作用於display為block的元素
藍色與藍色裡面的文字對比說明center可作用於文字，並且具有向子容器傳遞的特點
2、float只作用於容器本身，不作用於裡面的元素，不具有傳遞性
<style>.div1{width:100%;height:200px;background:#CF0;float:right;}.div2{width:100px;height:100px;float:right;background:#0F0;}.div3{width:100px;height:100px;background:#F00;}</style><body><div class="div1">我要float<div class="div2"></div><div class="div3"></div></div></body>
文字和紅色與綠色對比說明float可作用於容器本身，但不能作用於容器裡面的內容，也不能傳遞
簡單點說發就是text-align是個控制文本顯示的東西，flaot是控制某個容器的東西。比如說<div></div>如果你要控制這個塊的左右浮動方式就可以用float<div>並斌病冰賓</div>這裡面的東西的左靠右對齊方式，你就要用text-align.只需要記住一點容器(div....)用float 裡面的東西用text-align 一般設計出來的都能滿足w3c.
html中float,left,text-align,align怎使用？
float，text-align是css樣式。
1.float
float 屬性定義元素在哪個方向浮動。以往這個屬性總應用於映像，使文本圍繞在映像周圍，不過在 CSS 中，任何元素都可以浮動。浮動元素會產生一個塊級框，而不論它本身是何種元素。
如果浮動非替換元素，則要指定一個明確的寬度；否則，它們會儘可能地窄。
注釋：假如在一行之上只有極少的空間可供浮動元素，那麼這個元素會跳至下一行，這個過程會持續到某一行擁有足夠的空間為止。
執行個體：
把映像向右浮動：
img
{
float:right;
}
2.left
left是屬性值，float:left, text-align:left align:left 都是不同的
3.text-align
text-align 屬性規定元素中的文本的水平對齊。
該屬性通過指定行框與哪個點對齊，從而設定區塊層級元素內文本的水平對齊。通過允許使用者代理程式調整行內容中字母和字之間的間隔，可以支援值 justify；不同使用者代理程式可能會得到不同的結果。
執行個體
設定 h1、h2、h3 元素的文本對齊：
h1 {text-align:center}
h2 {text-align:left}
h3 {text-align:right}
4.align
align 屬性規定 元素中的內容的水平對齊。
執行個體
下面的 HTML 表格將 tbody 元素中的內容向靠右對齊：
<table border="1" width="100%">
<thead>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
</thead>
<tbody align="right">
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</tbody>
</table>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
