CSS3 边距

外边距

外边距是元素与元素之间的距离。

<div style="width: 100px; height:100px; background: #90aeff; margin20px;"></div>

<!-- margin: 20px; 元素四边同其他元素保持 20px 的距离 -->

<!-- 设置单独某一边的距离 -->
<!-- margin-top 上 / margin-right 右 /  margin-bottom 下 /  margin-left 左 -->
<!-- margin: 上 右 下 左; 简写形式 -->

效果


内边距

内边距是元素内部离边框的距离。

<div style="width: 100px; height: 100px; border: 1px solid #90aeff; padding: 20px;"> Hello </div>

<!-- padding 的语法同 margin -->

效果

Hello !
CSS3 教程 CSS3 入门 CSS3 选择器 CSS3 颜色 CSS3 单位 CSS3 字体 CSS3 文本 CSS3 光标 CSS3 盒子模型 CSS3 边框 CSS3 边距 CSS3 列表 CSS3 表格 CSS3 背景 CSS3 效果 CSS3 浮动 CSS3 定位 CSS3 响应式 CSS3 Columns CSS3 Flex