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 ...
随机推荐
- Spring事务异常回滚,捕获异常不抛出就不会回滚
最近遇到了事务不回滚的情况,我还考虑说JPA的事务有bug? 我想多了....... 为了打印清楚日志,很多方法我都加tyr catch,在catch中打印日志.但是这边情况来了,当这个方法异常 ...
- Event事件的兼容性(转)
window.event问题问题说明:window.event 只能在IE下运行,而不能在Firefox下运行,这是因为Firefox的event只能在事件发生的现场使用.解决方法:在事件发生的函数上 ...
- golang学习笔记 ---dup
对文件做拷贝.打印.搜索.排序.统计或类似事情的程序都有一个差不多的程序结构:一个处理输入的循环,在每个元素上执行计算处理,在处理的同时或最后产生输出.我们会展示一个名为 dup 的程序的三个版本 p ...
- nginx+php-fpm性能参数优化原则
1.worker_processes 越大越好(一定数量后性能增加不明显) 2.worker_cpu_affinity 所有cpu平分worker_processes 要比每个worker_pro ...
- HDOJ 1281 棋盘游戏
拆点二分图匹配 棋盘游戏 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Tot ...
- IRGAN:A Minimax Game for Unifying Generative and Discriminative Information Retrieval Models
https://arxiv.org/pdf/1705.10513.pdf 论文阅读笔记: https://www.cnblogs.com/liaohuiqiang/p/9694277.html htt ...
- windows系统安装ubuntu双系统
近期由于要学习python开发,经常需要用到linux环境.但是一般的编辑和办公在windows环境下有非常的舒服,所以就想装一个双系统.经过几经周折,终于在我的系统上装成功了,在这分享一些安装过程. ...
- java 泛型中class<T> 和T的区别是什么?
public <T> boolean edit(T entity) 和public <T> T get(Class<T> c, Serializable id)中这 ...
- Android 自定义 View 知识点
根据 Hencoder 提供的知识点,进行学习和总结. 三个要点: 布局 绘制 触摸反馈 绘制 自定义绘制:由自己实现绘制过程 常用绘制方法 onDraw(Canvas canvas) 绘制关键: c ...
- HTTP、 TCP、 IP、 Socket、 XMPP
网络自下而上分为: 物理层 数据链路层 网络层 传输层 会话层 表示层 应用层 HTTP:应用层协议,主要解决如何包装数据 XMPP:应用层协议 TCP:传输层协议,主要解决数据如何在网络中传输 IP ...