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%
css设置让a标签充满整个li的更多相关文章
- css设置div等标签背景半透明
三种方式: 1. background-color: transparent; 直接设置背景为透明 2.这种是子元素也会跟着变成半透明 /* 背景半透明,1为不透明 */ opacity: 0.5; ...
- 几个简单的css设置问题:div居中,ul li不换行 ,内容超出自动变省略号等
1 div在页面居中的问题 1)position值为relative时(相对定位),css设置属性margin:0 auto;(0 auto,表示上下边界为0,左右则根据宽度自适应相同值,即居中)即 ...
- CSS设置标签、图片放大、缩小、旋转、移动(tranform)
CSS设置标签.图片放大.缩小.旋转.移动(tranform) 1.缩小和放大属性(scale) 格式:tranform:缩小类型(数值): 注意:缩小和放大都是 scale : 其中的值(0~1)代 ...
- css设置超出部分文档隐藏(在table标签中不好使解决方案在下)
css设置: .text-over{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;cursor: pointer} div设 ...
- html+css学习笔记 2[标签]
img标签/a标签 <img src="图片地址" alt="图片名"/> 图片(单标签)alt属性 是图片名字,是给百度搜索引擎抓取使用: ...
- CSS设置行内元素和块级元素的水平居中、垂直居中
CSS设置行内元素的水平居中 div{text-align:center} /*DIV内的行内元素均会水平居中*/ CSS设置行内元素的垂直居中 div{height:30px; line-heigh ...
- 前端基础之CSS的引入+HTML标签选择器+CSS操作属性
clear:left/ringt属性 CSS:语法形式上由选择器+以及一条或多条声明组成:选择器查找到指定的html标签后,使用css属性设置html标签的样式: ...
- HTML|CSS之HTML常用标签
知识内容: 1.标签 2.head内标签 3.body内常用标签 注:本人使用的HTML为HTML5 一.标签 1.标签格式 标签的语法: <标签名 属性1=“属性值1” 属性2=“属性值2”… ...
- [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 ...
随机推荐
- linux平台下server运维问题分析与定位
结合我工作中碰到的运维问题,总结一下Linux下server常见的运维问题以及定位方式.这里的server主要指自主开发的逻辑server,web srv因为通常采用通用的架构所以问题比较少. 逻辑s ...
- go interface 的坑
一.概述 [root@node175 demo]# tree . ├── lib │ └── world.go ├── README └── server.go directory, files ...
- Android 桌面部件
桌面部件是一种利用AppWidget框架将应用程序的某个部件放在桌面. res/layout/digitalclock.xml <?xml version="1.0" enc ...
- System.Web.HttpValueCollection.ThrowIfMaxHttpCollectionKeysExceeded
昨天客户跟我说,突然一个页面频繁地报ThrowIfMaxHttpCollectionKeysExceeded这个异常.而且是数据量大的时候报错,数据量小的时候OK. 根据异常的名称也能看得差不多超过了 ...
- 【Oracle】Oracle索引
在关系数据库中,索引是一种与表有关的数据库结构,它可以使对应于表的SQL语句执行得更快.索引的作用相当于图书的目录,可以根据目录中的页码快速找到所需的内容. 对于数据库来说,索引是一个必选项,但对于现 ...
- window 10 企业版激活
一. 用管理员权限打开CMD.EXE 接着输入以下命令: slmgr /ipk NPPR9-FWDCX-D2C8J-H872K-2YT43 弹出窗口提示:“成功的安装了产品密钥”. 继续输入以下命令: ...
- Git 撤消操作(分布式版本控制系统)
1.覆盖提交 有时候我们提交完了才发现漏掉了几个文件没有添加,或者提交信息写错了.此时,可以运行带有 --amend 选项的提交命令尝试重新提交. $ git commit --amend 或 # g ...
- Java 内存模型及GC原理 (转载)
一个优秀Java程序员,必须了解Java内存模型.GC工作原理,以及如何优化GC的性能.与GC进行有限的交互,有一些应用程序对性能要求较高,例如嵌入式系统.实时系统等,只有全面提升内存的管理效率,才能 ...
- ArcGIS 10.2数字化线状要素时自己主动拼接成一条线
一開始一直和捕捉和经典捕捉过不去.最后才发现找错了地方,原来要Customize.自己定义加入"Continue Feature"工具,将其拖动到界面上的随意工具条内就可以.如图1 ...
- Android Support Library 23.2介绍(翻译自官方文档)
Android Support Library 23.2 (译者注:本文标注了部分文字链接,但须要***,要查看全部链接.请查看sukey=014c68f407f2d3e181b6b5e665f26a ...