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. Centos6.5+Redmine

    花了两天时间,基于centos6.5操作系统,搭建了redmine环境,在这里记录下过程中遇到的问题以及搭建流程. centos6.5; redmine2.5.0; Ruby1.9.3; step 1 ...

  2. [NOSQL] Redis介绍

    Redis概述 Redis是Salvatore Sanfilippo在2009年为其初创公司LLOOGG开发的,眼下仍是独立项目.但VMWare赞劣了项目(作者是其雇员).它採用C语言实现.因此性能非 ...

  3. what's the 跨期套利

    出自 MBA智库百科(https://wiki.mbalib.com/) 跨期套利的定义 跨期套利是套利交易中最普遍的一种,是股指期货的跨期套利(Calendar Spread Arbitrage)即 ...

  4. 这可能是由于 CredSSP 加密 Oracle 修正。

    1.Win+R 输入regedit打开注册表 找到对应的以下目录 HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\Polici ...

  5. LongAdder,AtomicIntegerFieldUpdater深入研究

    从LongAdder看更高效的无锁实现 AtomicIntegerFieldUpdater字段原子更新类 div:not([id]){display:none;} --> ul{padding: ...

  6. 20165236 2017-2018-2 《Java程序设计》第八周学习总结

    20165236 2017-2018-2 <Java程序设计>第八周学习总结 一.第十二章教材内容总结: 1.Java的多线程机制: 多线程是指一个应用程序中同时存在几个执行体,按几条不同 ...

  7. Font Awesome 最简单应用例子

    简介: Font Awesome为您提供可缩放的矢量图标,您可以使用CSS所提供的所有特性对它们进行更改,包括:大小.颜色.阴影或者其它任何支持的效果. 使用方法: 引入<link rel=&q ...

  8. IOT-SpringBoot-angular启动

    1  D:\workspace_iot\iot-hub\src\main\angular     cmd 启动  npm  start 2  eclipse中启动springboot 3  local ...

  9. js中实现IE的打印预览

    HTML中添加:<object id="WebBrowser" classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 widt ...

  10. jenkins windows slave 报错ERROR: Error cloning remote repo 'origin'

    在slave上是git clone ssh是可以成功的,但是jenkins调用slave节点就报如下错误: ERROR: Error cloning remote repo 'origin' huds ...