CSS样式中margin和padding的区别

最新推荐文章于 2022-07-12 14:13:41 发布
最新推荐文章于 2022-07-12 14:13:41 发布
阅读量647 收藏 3
点赞数
分类专栏： css 文章标签： css样式
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_39285609/article/details/94916596
版权

margin操作是对边框距离的调整如 margin-top ....

主要用作于两个标签之间的距离，如两个div标签之间距离

padding是标签中内容对标签框的距离调整如 padding-top

主要用作于内容和边框之间的距离，如一个p标签中有一段话，但是有不想紧贴着边框.所以就可以使用padding标签来使边框和文字产生距离. 

有点不想努力了
关注
  • 0
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
CSS中使用负margin值来调整居中位置
01-19
如果知道了各个元素的大小，设置等于宽高一半大小的负margin值（如果没有使用box-sizing: border-box样式，还需要加上padding值），再配合top: 50%; left: 50%;样式就会使块元素居中。 需要注意的是，这是按照预想...
Css样式表中：margin、paddi…
stven_king的专栏
12-18 1163
原文地址：Css样式表中：margin、padding和border作者：相淋 样式表的精髓：margin和padding和border 一、padding 我们可以把加过样式表的HTML标记看成是一个盒子。 对这个盒子中的内容控制，用到的样式：padding 它又分为：padding-left、padding-right、padding-bottom、padding-top padding是什么
margin与padding
MoonLight_dR的博客
01-23 200
margin与padding的区分 1. margin与padding都是指边距，有上下左右四个边距,之前一值分不清有什么区别 首先如下图直观感受： 将整个界面看作一个大的容器，而里面有很多个小容器组成： border：边框： margin：外边距（可以理解为小容器到边框的距离）； padding：内边距（可以理解为小容器内部的文字到该容器的边距）。 可以更改不同的margi
CSS中margin和padding的区别
wujian_csdn_csdn的博客
09-16 2801
区别如下： margin是指从自身边框到另一个容器边框之间的距离，就是容器外距离。 padding是指自身边框到自身内部另一个容器边框之间的距离，就是容器内距离。 CSS是层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。 ...
外边距样式属性---margin
YXX_decsdn的博客
05-18 1239
margin1，margin-top样式属性2，margin-bottom样式属性3，margin-right样式属性4，margin-left样式属性5，margin样式属性 在讨论margin-top和margin-bottom 之前，先创建如下HTML文件，以此为例讨论下边的margin样式属性，以div标签为例说明（div标签是块级元素） 在浏览器执行窗口显示如下： 1，margin-...
网页CSS样式——详述margin样式属性
CandidBoy的博客
05-20 2030
一、margin样式属性作用 用于在一个声明中设置所有外边距的宽度，或者设置各边上外边距的宽度。该属性有多个值。 二、margin样式属性值介绍 1、atuo 浏览器计算外边距 2、length 浏规定以具体单位计的外边距值，比如像素、厘米等。默认值是0px。注：允许使用负值，不过要谨慎使用 3、% 规定基于父元素的宽度的百分比的外边距 4、inherit 规定应该从父元素继承外...
CSS边距属性定义是用margin还是用padding的两者对比
09-25
用CSS做网页时.边距用哪个属于好呢?是margin属性还是padding属性呢.
深入解析CSS中margin属性的使用
12-13
一、Margin的特性margin始终是透明的。margin通过使用单独的属性，可以对上、右、下、左的外边距进行设置。即：margin-top、margin-right、margin-bottom、margin-left。外边距的 margin-width 的值类型有：auto | ...
CSS样式表教程：浏览器默认样式
12-10
也许一个很漂亮的CSS样式表在一个浏览器上表现良好，在另外一个浏览器上即使是没有CSS Bug的情况也会变得结构混乱起来，我都是浏览器默认样式在作怪。 因此，我们在生成CSS样式规则的时候，一个必做的步骤就是重设...
css中子元素设置margin-top为什么影响了父元素
12-11
本文介绍了css中子元素设置margin-top为什么影响了父元素，分享给大家，具体如下： <style type="text/css"> *{ margin: 0px; padding: 0px; } .show{ margin: 0px auto; width: 200px; height: ...
高度导致IE6中两个DIV有3px空隙问题_margin-right/left可解决
01-21
最近做的页面基本上都是自适应的，经常使用如下的写法： 复制代码代码如下: <div xss=removed> <div xss=removed>sdf</div> <div xss=removed>sdf</div> </div> 左边的DIV使用float，右边的DIV则自适应。昨天给右边的DIV添加了一个高度，发现在IE6中出现了问题。（以下两个实例的区别只能在IE6中才能看到） 左边DIV 此DIV未
CSS中margin和padding的区别浅析
01-19
在CSS中margin是指从自身边框到另一个容器边框之间的距离，就是容器外距离。在CSS中padding是指自身边框到自身内部另一个容器边框之间的距离，就是容器内距离。 下面讲解 padding和margin常用的用法 一、padding 1、语法结构 （1）padding-left:10px; 左内边距 （2）padding-right:10px; 右内边距 （3）padding-top:10px; 上内边距 （4）padding-bottom:10px; 下内边距 （5）padding：10px; 四边统一内边距 （6）padding:10px 20px; 上下、左右内边距 （7）padd
html padding如何设置内边距,内边距：padding - CSS | 绿叶学习网
weixin_29058331的博客
07-09 3343
内边距padding，又常常被称为“补白”，它指的是内容区到边框之间的那一部分。内边距都是在边框内部的。一、padding局部样式从CSS盒子模型中我们可以看出，内边距分为4个方向：padding-top、padding-right、padding-bottom、padding-left。语法：padding-top: 像素值;padding-right: 像素值;padding-bottom: ...
CSS 样式表中padding 的用法
weixin_34080571的博客
02-02 1634
CSS中padding 描述的是内边距的意思，margin是外边距。QSS中同样的道理。 1. padding表示内边距的意思，margin---外边距。2. CSS的 padding 属性定义元素边框与元素内容之间的空白区域。3. padding 接受长度值或百分比值，但不允许使用负值。4. 示例：如果希望所有内边距都是10 像素，只需要设置：padding:10px; 就可以了。5. 也可以...
div的样式之padding
weixin_45637488的博客
04-03 2212
padding：内容和边框之间的距离 设置padding宽度后，会发生在原有基础上发生扩张，背景颜色与div盒子的background-color相同。 <!-- 内边距(padding)：内容和边框之间的距离 --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=de
HTML中详述外边距样式属性（margin）与内边距样式属性（padding）
热门推荐
zzu957的博客
07-15 2万+
外边距样式属性（margin） 外边距样式属性（margin）：设置边框外的距离。 属性：margin-top样式属性，margin-bottom样式属性，margin-left样式属性和margin-right样式属性。 代码示例： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body>
5_常见样式-padding
weixin_30764137的博客
04-09 107
　　首先，padding这个简写属性设置元素所有内边距的宽度，或者设置各边上内边距的宽度。行内非替换元素上设置的内边距不会影响行高计算；因此，如果一个元素既有内边距又有背景，从视觉上看可能会延伸到其他行，有可能还会与其他内容重叠。元素的背景会延伸穿过内边距。 　　注意，padding不允许指定负边距值。 　　“padding”内填充(内边距)是在在元素的边框以里，内容以外产生一个距离，用来控制...
CSS中margin和padding属性的区别
weixin_50547200的博客
06-24 6641
在CSS中，margin和padding两个属性都可以调整位置，因此比较容易混淆。这篇文章详细分析两者的不同，希望对学习CSS的朋友有帮助。padding的作用是调整当前元素内容(例如文本内容)在元素中的位置。默认内容应该是紧贴元素的边界显示，增加padding后可以增大内容和边界的距离。可看如下代码： div.y未设置padding，而div.x设置了四个padding属性，其效果如下图： 大家可以看到在风格为div.y中，文字是紧贴div这个元素范围的边界的，也就是默认文字的高度和所覆盖的...
Margin 与Padding的区别
m0_59181747的博客
07-12 6767
margin是外边距，即盒子与盒子之间的距离，而padding是内边距，是盒子的边与盒子内部元素的距离。margin是用来隔开元素与元素的间距；padding是用来隔开元素与内容的间隔。 例如两个文本框的距离使用margin，文本框的边框和文本内容之间的距离使用paddingmargin是指从自身边框到另一个容器边框之间的距离，就是容器外距离。 padding是指自身边框到自身内部另一个容器边框之间的距离，就是容器内距离。...
html中的margin和padding
最新发布
09-23
在HTML中，可以通过CSS样式来设置元素的margin和padding属性。例如，以下代码可以将元素的上下左右margin和padding都设置为10像素： ``` div { margin: 10px; padding: 10px; } 这是一个div元素 ``` 希望能...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值