zoukankan      html  css  js  c++  java
  • CSS行内块元素(内联元素)

    一、典型代表  

    • input
    •  img

    二、特点:

    • 在一行上显示
    • 可以设置宽高    
    <style type="text/css">
            img{
                width: 300px;
               /* 顶部对齐           */
                vertical-align: top;
            }
            input{
                width: 300px;
                height: 200px;
                background-color: blue;
            }
        </style>
    </head>
    <body>
        <img src="../2.26/picture.jpg" alt="">
        <input type="text">
    </body>
    •  补充:行内块与行内块之间的空隙:如果两个span在HTML这样放置,会出现空隙,使用浮动可以去除这种间隙.
    span {/*span转换为行内块,设置300宽高和黑色边框*/
                display: inline-block;
                border: 1px solid #000;
                width: 300px;
                height: 300px;
            }
    <body>
        <span></span>
        <span></span>
    </body>

    <body>
        <span></span><span></span>
    </body>

  • 相关阅读:
    编译安装LEMP
    eAccelerator配置和使用指南
    /dev/null的用途
    分库分表
    JVM
    SOFA 数据透析
    HTTPS
    SOFA 通信
    分布式锁
    mysql 锁
  • 原文地址:https://www.cnblogs.com/EricZLin/p/8606210.html
Copyright © 2011-2022 走看看