
- Ionic 基礎教程
- Ionic - 首頁
- Ionic - 概述
- Ionic - 環境搭建
- Ionic CSS 元件
- Ionic - 顏色
- Ionic - 內容
- Ionic - 頁首
- Ionic - 頁尾
- Ionic - 按鈕
- Ionic - 列表
- Ionic - 卡片
- Ionic - 表單
- Ionic - 切換按鈕
- Ionic - 複選框
- Ionic - 單選按鈕
- Ionic - 範圍選擇器
- Ionic - 選擇框
- Ionic - 標籤頁
- Ionic - 網格
- Ionic - 圖示
- Ionic - 內邊距
- Ionic Javascript 元件
- Ionic - JS 動作表單
- Ionic - JS 背景
- Ionic - JS 內容
- Ionic - JS 表單
- Ionic - JS 事件
- Ionic - JS 頁首
- Ionic - JS 頁尾
- Ionic - JS 鍵盤
- Ionic - JS 列表
- Ionic - JS 載入
- Ionic - JS 模態框
- Ionic - JS 導航
- Ionic - JS 彈出框
- Ionic - JS 彈窗
- Ionic - JS 滾動
- Ionic - JS 側邊選單
- Ionic - JS 滑動框
- Ionic - JS 標籤頁
- Ionic 高階概念
- Ionic - Cordova 整合
- Ionic - AdMob
- Ionic - 攝像頭
- Ionic - Facebook
- Ionic - 應用內瀏覽器
- Ionic - 原生音訊
- Ionic - 地理位置
- Ionic - 媒體
- Ionic - 啟動畫面
- Ionic 有用資源
- Ionic - 快速指南
- Ionic - 有用資源
- Ionic - 討論
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>
以上程式碼將產生以下螢幕 -

廣告