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. 解决因为Telnet没有启动导致FTP无法连接的问题

    今天ytkah在其他电脑上想用ftp传点东西发现居然连接不上,查看了一下服务器安全组规则里的端口,也没有相关屏蔽.问了一下运维,他说可能是Telnet没有开启.就试着去看看有没问题.打开 控制面板 - ...

  2. laravel项目thinksns+安装pc前端页面

    前面我们说了laravel项目ThinkSNS+安装,现在要安装给用户看的页面,方便他们进行一些操作,比如发表文字/提问之类,这个已经模块化了,用composer就可以完成.命令行代码如下(之前是co ...

  3. 用composer安装laravel-bjyblog

    前面讲了两行命令composer的安装,现在我们来操作一下composer安装基于laravel的博客laravel-bjyblog.测试环境是linux,bt面板,php7.2安装扩展fileinf ...

  4. Win7各版本功能对比

  5. spring boot 启动类一定要放置到包的根目录下，也就是和所有包含java文件的包在同一级目录。如果不放置在根目录下，将会提示 no mybatis mapper was found

    spring boot 启动类一定要放置到包的根目录下,也就是和所有包含java文件的包在同一级目录.将会将同一目录下的包扫描成bean. 如果不放置在根目录下,将会提示 no mybatis map ...

  6. Scala集合(一）

    Scala集合的主要特质 Iterator,用来访问集合中所有元素 val coll = ... // 某种Iterable val iter = col.iterator while(iter.ha ...

  7. Oracle查看用户密码过期，修改永不过期

    01.查看当前open用户 select username,account_status,expiry_date,profile from dba_users; 02.查看目前的密码过期策略 sele ...

  8. Elasticsearch 搜索模块之Cross Cluster Search（跨集群搜索）

    Cross Cluster Search简介 cross-cluster search功能允许任何节点作为跨多个群集的federated client(联合客户端),与tribe node不同的是cr ...

  9. Linux系统文件目录

    下面的示例是我个人的亚马逊云服务器,查看了几个关键目录的文件信息. 可以注册一个账号,免费试用一年,自己用来玩,还是很不错的 .https://aws.amazon.com/cn/ec2/ 根目录下面 ...

  10. 实验一Java开发环境的熟悉-3

    实现学生成绩管理功能(增删改,排序,查找),并进行测试(正常情况,异常情况,边界情况). 代码: