Ionic - 內邊距



Ionic 提供了一種簡單的方法來為元素新增內邊距。可以使用幾個類,它們都會在元素的邊框與其內容之間新增 **10px** 的距離。下表顯示了所有可用的內邊距類。

內邊距類

類名 類資訊
padding在每一側新增內邊距。
padding-vertical在頂部和底部新增內邊距。
padding-horizontal在左側和右側新增內邊距。
padding-top在頂部新增內邊距。
padding-right在右側新增內邊距。
padding-bottom在底部新增內邊距。
padding-left在左側新增內邊距。

使用內邊距

當您想為元素應用一些內邊距時,您只需要分配上表中的一個類即可。以下示例顯示了兩個塊級按鈕。第一個使用 **padding** 類,第二個不使用。您會注意到第一個按鈕更大,因為它應用了 **10px** 的內邊距。

<div class = "button button-block padding">Padding</div>
<div class = "button button-block">No padding</div>

以上程式碼將產生以下螢幕 -

Ionic Padding
廣告