码迷,mamicode.com
首页 > Web开发 > 详细

css设置让a标签充满整个li

时间:2018-05-14 17:36:59      阅读:1763      评论:0      收藏:0      [点我收藏+]

标签:block   audio   lin   文字   color   设置   鼠标   lock   style   

首先贴一段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%

css设置让a标签充满整个li

标签:block   audio   lin   文字   color   设置   鼠标   lock   style   

原文地址:https://www.cnblogs.com/superxuezhazha/p/9037064.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!