css中padding和margin的区别

margin 外边距

border 边框

padding 内边距

padding-left:10px; 左内边距、padding-right:10px; 右内边距、padding-top:10px; 上内边距、padding-bottom:10px; 下内边距。

margin:margin-left:10px; 左外边距、margin-right:10px; 右外边距、margin-top:10px; 上外边距、margin-bottom:10px; 下外边距。

margin是指从自身边框到另一个容器边框之间的距离,就是容器外距离。

padding是指自身边框到自身内部另一个容器边框之间的距离,就是容器内距离。

1、意思不同。margin:auto=margin:auto auto auto auto,表示上下左右都为auto;margin:0 auto=margin:0 auto 0 auto,表示上下为0,左右为auto;

2、居中方式不同。margin:auto表示横竖都居中,margin: 0 auto表示横居中,竖不居中;

margin后面一般会跟4个参数,如margin:1px、1px、1px、1px,分别表示上外边距为1px、右外边距为1px、下外边距为1px、左外边距为1px。

如果后面只写2个参数的话,如margin:1px、2px,则表示上下外边距为都为1px,左右外边距都为2px。

CSS中:margin和padding的区别 margin:auto与margin: 0 auto区别相关推荐

  1. html5 lang en 乱码,CSS中的html [lang =“en”]和html:lang(en)有什么区别?

    The difference between :lang(C) and the '|=' operator is that the '|=' operator only performs a comp ...

  2. css中indent是什么意思,css中text-indent用法及与padding的区别详解

    语法: text-indent : length 参数: length : 百分比数字|由浮点数字和单位标识符组成的长度值,允许为负值.请参阅长度单位 说明: 检索或设置对象中的文本的缩进. 在被另一 ...

  3. margin、padding、border

    (一)含义与原理 margin是指从自身边框到另一个容器边框之间的距离,就是容器外距离. padding是指自身边框到自身内部另一个容器边框之间的距离,就是容器内距离. border指边框 (1)平面 ...

  4. Div+CSS布局入门教程(五) 页面制作-用好border和clear 附加:1.DIV+CSS设计原则 2.DIV+CSS中标签ul ol li dl dt dd用法

    这一节里面,主要就是想告诉大家如何使用好border和clear这两个属性. 首先,如果你曾用过table制作网页,你就应该知道,如果要在表格中绘制一条虚线该如何做,那需要制作一个很小的图片来填充,其 ...

  5. CSS中margin和padding的区别

    padding.margin都是边距的含义,关键问题得明白是什么相对什么的边距.padding是控件的内容相对控件的边缘的边距,margin是控件边缘相对父空间的边距. 在CSS中margin是指从自 ...

  6. CSS 中 的 margin、border、padding 区别 (内边距、外边距)

    前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家.点击跳转到教程. 图解CSS padding.margin.border属性 W3C组织建议把所有网页上的对像都放在一 ...

  7. CSS中的margin、border、padding区别 CSS padding margin border属性详解

    图解CSS padding.margin.border属性 W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层 ...

  8. CSS中margin和padding属性的区别

    在CSS中,margin和padding两个属性都可以调整位置,因此比较容易混淆.这篇文章详细分析两者的不同,希望对学习CSS的朋友有帮助. 1. padding padding的作用是调整当前元素内 ...

  9. CSS中IE和火狐对margin、padding的兼容性解析

    1.IE与Fire Fox识别CSS属性区别标签 !important #page_body{ width: 1000px !important; height:30px !important; wi ...

最新文章

  1. linux mysql 不稳定_linux,mysql:今天写出一个十分弱智的bug!
  2. 大脚导入配置选择哪个文件_「科普向」为何我用大脚时,单体插件会安装失败?...
  3. dbunit java_Java – 让DbUnit使用Hibernate事务
  4. tomcat源码分析(一)初始化---Debug方式
  5. django-url映射给函数给默认值
  6. android adjust,android adjustresize adjustpan着名的问题
  7. 数据结构----出栈顺序有效性的判断
  8. JSON(4)---JSON.parse()
  9. SQL Server中CTE的另一种递归方式-从底层向上递归
  10. 智能手机低价“裸奔”( 山寨手机芯片“海思K3”VS“MTK”)
  11. 红烧鸡翅(简单又好吃)
  12. Android 手写签名 (图片合成)
  13. 如何管理一个外包团队小总结
  14. Linux云计算【第一阶段】第十二章:网络管理、进制及SSH管理与攻防
  15. FireFox插件 - Greasemonkey
  16. 蓝桥杯——算法基础 逗志芃的暴走PYTHON
  17. ubuntu里的桌面便签工具
  18. 如何从 Trados双语文件 中获得 原文 的方法
  19. Linux下的文件读写
  20. 一篇读懂自动驾驶汽车决策层算法的新思路

热门文章

  1. 搞笑新闻联播之老公岗位制度(上)铃声 搞笑新闻联播之老公岗...
  2. aoc显示器2k165hz测试
  3. Python 判断列表中是否含有给定字符串
  4. 两种方法实现轮播图效果
  5. 从northwind中查询Products中最高单价(UnitPrice)是多少;
  6. iOS调试程序的方法
  7. KeyShot中的半透明材质怎样来创建液体
  8. OPC DA 与 OPC UA区别
  9. 为什么会显示贵州云服务器,为什么云服务器都放在贵州
  10. C语言有必要学的很深入细致吗?