zoukankan      html  css  js  c++  java
  • css设置让a标签充满整个li

    首先贴一段html代码:

    <li id="sendText"><a href="#" title="发送文字"></a></li>
    <li id="mic"><a href="#" title="关闭麦克风"></a></li>
    <li id="camera"><a href="#" title="关闭摄像头"></a></li>
    <li id="audio"><a href="#" title="关闭音量"></a></li>
    <li id="changeCam"><a href="#" title="切换摄像头"></a></li>
    <li id="hang-up"><a href="#" title="挂断"></a></li>

    我们想设置a标签,使得鼠标移入的时候有提示信息。但是如果原生的css,a标签中没有内容的话,其大小是0*0,无法达到效果

    我们进行如下设置:

    .videoContent .bottom li{
        width:10%;
        height:100%;
        float:left;
        display:inline;
    
    }
    .videoContent .bottom a{
        display:block;
        height:100%
    
    }

    把li设置为 inline,把a设置为block并且设置高度为100%

  • 相关阅读:
    JS数组分页
    UI框架
    mongodb
    koa2 router中间件的三种写法
    Float浮点数转二进制串和十六进制串
    Iterator和for...of循环
    mysql相关故障
    lsof
    iostat测试磁盘性能
    dd测试磁盘
  • 原文地址:https://www.cnblogs.com/superxuezhazha/p/9037064.html
Copyright © 2011-2022 走看看