zoukankan      html  css  js  c++  java
  • display:inline,inlineblock,block元素的区别

    块元素 display:block

    1.我是块级元素,总是在新的一行开始

    2.宽度,高度,行高,以及顶和底都可以控制。(默认是容器的宽和高的100%)

    3.我的垂直相邻外边距会合并,默认取最大值

    内联元素 display:inline

    1.我是行内元素,和其他元素在同一行上。

    2.宽度,高度,行高,以及顶和底都不可以改变。(默认是自身的宽和高)

    3.我么有上下外边距,但是我的左右边距不会合并。

    inline-block元素(介于内联元素和块元素之间)

    1.我是inline-block元素,我是内联对象,但是我里面的内容作为块对象呈递。旁边的内联对象会被呈现在同一行。

    2.宽度,高度,行高,以及顶和底都可以控制。

    3.我和内联元素一样,元素中间默认会有空隙。

    下一篇文章中会讲:如何去除内联元素(inline-block元素)之间的间距

    学透前端行业所有技术,玩遍北京周边所有城市。然后我会回到那个生我养我的地方,因为有亲人的地方才是家。
  • 相关阅读:
    随机id
    vue关于父组件调用子组件的方法
    ES6——块级作用域
    在vue中引用superMap
    MSSQL备份脚本
    Ubuntu 使用命令导出数据库
    CSS before 中文乱码
    CentOS7 安装linux 网络不联通问题
    SVN update failed问题解决
    JQ实现树形菜单点击高亮
  • 原文地址:https://www.cnblogs.com/snowinmay/p/2829615.html
Copyright © 2011-2022 走看看