首先贴一段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的更多相关文章

  1. css设置div等标签背景半透明

    三种方式: 1. background-color: transparent; 直接设置背景为透明 2.这种是子元素也会跟着变成半透明 /* 背景半透明,1为不透明 */ opacity: 0.5; ...

  2. 几个简单的css设置问题:div居中,ul li不换行 ,内容超出自动变省略号等

    1  div在页面居中的问题 1)position值为relative时(相对定位),css设置属性margin:0 auto;(0 auto,表示上下边界为0,左右则根据宽度自适应相同值,即居中)即 ...

  3. CSS设置标签、图片放大、缩小、旋转、移动(tranform)

    CSS设置标签.图片放大.缩小.旋转.移动(tranform) 1.缩小和放大属性(scale) 格式:tranform:缩小类型(数值): 注意:缩小和放大都是 scale : 其中的值(0~1)代 ...

  4. css设置超出部分文档隐藏(在table标签中不好使解决方案在下)

    css设置: .text-over{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;cursor: pointer} div设 ...

  5. html+css学习笔记 2[标签]

    img标签/a标签 <img src="图片地址" alt="图片名"/>  图片(单标签)alt属性 是图片名字,是给百度搜索引擎抓取使用:    ...

  6. CSS设置行内元素和块级元素的水平居中、垂直居中

    CSS设置行内元素的水平居中 div{text-align:center} /*DIV内的行内元素均会水平居中*/ CSS设置行内元素的垂直居中 div{height:30px; line-heigh ...

  7. 前端基础之CSS的引入+HTML标签选择器+CSS操作属性

    clear:left/ringt属性 CSS:语法形式上由选择器+以及一条或多条声明组成:选择器查找到指定的html标签后,使用css属性设置html标签的样式:                   ...

  8. HTML|CSS之HTML常用标签

    知识内容: 1.标签 2.head内标签 3.body内常用标签 注:本人使用的HTML为HTML5 一.标签 1.标签格式 标签的语法: <标签名 属性1=“属性值1” 属性2=“属性值2”… ...

  9. [css] 浏览器字体和css设置字体之间的关系

    原文链接:http://www.zhangxinxu.com/wordpress/2010/06/%E5%8F%AF%E7%94%A8%E6%80%A7%E4%B9%8B%E6%B5%8F%E8%A7 ...

随机推荐

  1. Elasticsearch报警插件Watch安装以及使用

    参考:http://blog.csdn.net/ptmozhu/article/details/52296958 http://corejava2008.iteye.com/blog/2214279 ...

  2. mysql5.7创建用户授权删除用户撤销授权

    一, 创建用户: 命令: CREATE USER 'username'@'host' IDENTIFIED BY 'password'; 说明:username - 你将创建的用户名, host - ...

  3. 蓝牙进阶之路 (002) - HC-05与HC-06的AT指令的区别(转)

    蓝牙HC-05与HC-06对比指令集 高电平->AT命令响应工作状态     低电平->蓝牙常规工作状态 <重新上电表示完成复位> HC-05 可以主从切换模式,但是HC-06 ...

  4. dll版本兼容

    <runtime> <assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1"> <depen ...

  5. .net获取当前url各种属性(文件名、参数、域名、端口等)的方法(转)

    假设当前页完整地址是:http://www.test.com:80/aaa/bbb.aspx?id=5&name=kelli "http://"是协议名 "www ...

  6. android 蓝牙编程重点---如何发送和接收16进制数据

    最近的android蓝牙开发项目也逐渐接近尾声,基本的功能都已经完成,只剩下界面的设计.现在真的是舒了一口气! 作为编程学习经验只有1年的菜鸟,这是我独自完成的商业性产品,而且还是涉及到与单片机蓝牙模 ...

  7. Oracle 12C -- clone a non-cdb as a pdb

    将non-CDB置为只读模式: $ sqlplus '/as sysdba' SQL> select name, decode(cdb, 'YES', 'Multitenant Option e ...

  8. Oracle 12C -- 使用local PDB克隆新的PDB

    1.将用于克隆的PDB至于只读状态:startup open read only SQL> select con_id,name,open_mode from v$pdbs; CON_ID NA ...

  9. SharePoint CAML In Action——Part II

    在SharePoint中,相对于Linq to SharePoint而言,CAML是轻量化的.当然缺点也是显而易见的,"Hard Code"有时会让你抓狂.在实际场景中,经常会根据 ...

  10. windows下php的各个版本下载地址

    windows下php的各个版本 https://windows.php.net/downloads/releases/archives/