图片和边框的距离调整html,调整 CSS DIV 区块内的文字与边框的距离

8种机械键盘轴体对比

本人程序员，要买一个写代码的键盘，请问红轴和茶轴怎么选？

CSS DIV 区块内的文字与 DIV 区块本身的边框距离默认值通常是不分开的，换句话说，文字会与 DIV 区块的边框黏在一起，在视觉上来说，并不是很美观，所以我们必须透过一些技巧来调整 DIV 区块内的文字与边框的距离，这里我们使用到的是 CSS 内距调整 padding 属性，这是 CSS 调整元素内距的标准属性，使用方式非常简单，这里提供几个范例让各位读者参考。

调整 CSS DIV 区块内的文字与边框的距离范例

这是内距为 5px 的效果

这是内距为 10px 的效果

这是内距为 20px 的效果

范例的效果

这是内距为 5px 的效果

这是内距为 10px 的效果

这是内距为 20px 的效果

由范例的效果可以看出，padding 的参数用得越大，代表 DIV 区块内的文字与 DIV 区块本身的边框距离越大，我们这个范例调整的是区块内文字与边框的距离，同样的概念也可以用在调整区块内图片或影片与 DIV 区块边框的距离唷！

附带一提，范例中的 border 是 CSS 用来设计元素边框的标准属性，详细用法请参阅：CSS border 边框设计。

boniuav的牛爱网