margin

是设置两个标签的间隔，也就是距离；

padding

这个是比如一个p标签，它是100px*100px,我们使用的时候p标签的文字是贴着p标签的最左侧的，想要它的文字距离边界远一点，好看一点，就是需要做一个样式的调整，我们可以用到padding这个属性，加入说设置是10px，就是说这个p标签的大小依然是100px*100px，但是它的内容是变成了90px*90px；

border

boarder是设置边框的意思，他和padding的区别在于，padding是在标签边缘往里缩减，而border是在标签的边缘往外扩展，也就是说是一个100px*100px的标签，我设置他的border为20px，我们就可以看到整个标签的大小是变成了120px*120px，也就是说多出来了20px，其标签的内容也还是100px*100px的

margin、padding、border区分的更多相关文章

  1. css007 margin padding border

    css007 margin padding border 1.理解盒模型(盒模型:就是把一些东西,包括html各种标签都包含在一个 看不见的盒子里) 1/在web浏览器中任何标签都是一个盒子,内容的周 ...

  2. margin padding border

    Difference between margin and padding? Remember these 3 points: The Margin is the extra space around ...

  3. css样式margin padding border

  4. CSS中的margin、border、padding区别

    CSS padding margin border属性详解 图解CSS padding.margin.border属性W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来 ...

  5. 【转】图解CSS padding、margin、border属性

    http://www.cnblogs.com/linjiqin/p/3556497.html 图解CSS padding.margin.border属性W3C组织建议把所有网页上的对像都放在一个盒(b ...

  6. [html]CSS中的margin、border、padding区别

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

  7. python 全栈开发，Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)

    一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...

  8. css的padding,border,margin的意思

    下面的内边距(padding).边框(border) .外边距(margin)的意思是我自己的理解. 代码如下: <!DOCTYPE html> <html lang="e ...

  9. 盒模型大小取决于它的padding，margin，border数值

    盒模型规定了元素框处理元素内容width与height值.内边距padding.边框border 和 外边距margin 的数值大小.边框内的空白是内边距padding,边框外的空白是外边距margi ...

  10. padding/border与width的关系

    本文讲述 padding / border 的设置后是否对 width 有影响,width 等于 auto 与 100% 的区别 CSS 框模型 (Box Model) 规定了元素框处理元素内容.内边 ...

随机推荐

  1. MongoDB pymongo模块

    安装pymongo模块 pip install pymongo 连接mongodb代码,生成pymongo对象,传入连接服务器相关参数 ip 端口 如果使用指定的账户登录,设置要登录的账户和密码,然后 ...

  2. Python day2 基础 2 数据类型

    数据类型初识 1.数字 2 是一个整数的例子.长整数 不过是大一些的整数.3.23和52.3E-4是浮点数的例子.E标记表示10的幂.在这里,52.3E-4表示52.3 * 10-4.(-5+4j)和 ...

  3. Sql server 2016 Always On 搭建Windows集群配置

    .安装WSFC群集组件 1)打开服务器管理器,选择“功能”,在右边窗口中点击“添加功能”. 2)在添加功能向导中,勾选“故障转移群集”,点击“下一步”. 3)在“确认安装选择”页面中,点击“安装”,进 ...

  4. 简单好用的计算器：bc

    1.简单好用的计算器:bc (1)参数: (2)实例: 执行浮点运算和一些高级函数 设定小数精度(数值范围) 进制转换 执行结果为:11000000,这是用bc将十进制转换成二进制 计算平方和平方根:

  5. wx工具栏，菜单栏，状态栏

    #!/usr/bin/env python # -*- coding: utf- -*- import wx import wx.py.images class ToolbarFrame(wx.Fra ...

  6. 八种排序算法--java实现（转）

    (转:http://blog.csdn.net/without0815/article/details/7697916) 8种排序之间的关系: 1, 直接插入排序 (1)基本思想:在要排序的一组数中, ...

  7. Learn golang: Top 30 Go Tutorials for Programmers Of All Levels

    https://stackify.com/learn-go-tutorials/ What is Go Programming Language? Go, developed by Google in ...

  8. 小程 序swiper自适应宽高

    https://blog.csdn.net/qq_31604363/article/details/73715944 小程 序swiper自适应宽高 小程 序swiper自适应宽高

  9. [LeetCode] 74. Search a 2D Matrix_Medium tag: Binary Search

    Write an efficient algorithm that searches for a value in an m x n matrix. This matrix has the follo ...

  10. js模拟链表---双向链表

    双向链表: 每个元素,有一个 next(指向下一个元素)和一个prev(指向前一个元素) function dbLinkedList(){ var length=0; var head = null; ...