先看效果圖：在線體驗
其中輸入框乙濒、按鈕的樣式在這篇文章里
table
1. 讓表格的第一列文字向右對齊
假設(shè)可以找到 table 標簽下面的所有 td 標簽：
table > tbody > tr > td:first-child {
text-align: right;
}
2. 調(diào)節(jié)行高
2.1. 首先看一下行內(nèi)元素與塊級元素的區(qū)別：
- 行內(nèi)元素會再一條直線上预吆，是在同一行的
- 塊級元素各占一行倘感，是垂直方向的
- 行內(nèi)元素不可以控制寬和高
2.2. 常見的行內(nèi)元素和塊級元素：
塊級元素：
<div>、<p>风瘦、<h1>...<h6>犁钟、<ol>、<ul>、<dl>秘噪、<table>狸吞、<address>、<blockquote>指煎、<form>
行內(nèi)元素：
<a>蹋偏、<span>、<br>至壤、<i>威始、<em>、<strong>像街、<label>黎棠、<q>、<var>镰绎、<cite>脓斩、<code>
2.3. 不可以給 tr 設(shè)置 margin、padding畴栖，但可以給 td 設(shè)置 padding
原因：
table中tr默認display: table-row ;随静， 雖可修改為display: block;，但會失去tr特有的顯示效果吗讶，如td自動對齊燎猛。
解決辦法有三種 ：
- 可以通過給
td設(shè)置padding修改行高； - 設(shè)置
line-height: 30px;為你想要的高度照皆； - 給
table設(shè)置
table {
border-spacing : 10px 10px ;
}
```
### 3. 去掉表格的背景和邊框等不需要的樣式重绷，并增加單元格間隙
要增加單元格間隙，可以這樣做：
table {
border-collapse: separate; /其實不寫這句可以膜毁，因為 border-collapse 默認為 separate/
border-spacing : 10px 10px ;
}
```
