- 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>
以上代码将产生以下屏幕 -
广告