zoukankan      html  css  js  c++  java
  • 两个inline元素或 inline-block元素中间有间隙

    在写代码的时候遇到个问题,就是两个行内块元素之间有间隙,如下图

    1.如果两个块用float属性,父级元素就得清楚浮动,可以解决空隙

    2.使用css-flex属性 给父级元素加上display:flex, 可以解决

    如果不用其他方法,空隙还是存在,代码如下

    <style>
    #id1{
       margin-left: 100px;
       display: inline;
       background-color: #ddd;
    }
     #id2{
        display: inline;
         200px;
        height: 300px;
       background-color: blueviolet;
    }
    </style>
    <
    div id="id"> <div id="id1">scope1</div> <div id="id2">scope2</div> </div>

    后来发现将盒子里的两个div 写在一起就没有空隙了,代码如下:

    <div id="id">
        <div id="id1">scope1</div><div id="id2">scope2</div>
    </div>

    应该是标签之前的制表符 换行 或者空格显示出来,占位了

  • 相关阅读:
    CSS基础(十七)--Padding和margin(内边距和外边距)
    tomcat动态网站
    http和nginx错误定义
    nginx动态网站
    nginx动静分离
    nginx负载均衡
    nginx介绍
    cobbler服务器
    apache网络配置
    网络源
  • 原文地址:https://www.cnblogs.com/hill-foryou/p/12850164.html
Copyright © 2011-2022 走看看