css隐藏文字的小技巧
前段时间,在做项目的时候,遇到一个问题。背景图片上有一个“立即注册”的按钮,需要点击。但是问题是:现在的图片是背景图片,如果图片是在html页面内的话,我们可以使用锚点来对图片添加链接。这个时候,我们就可以使用隐藏文字的方法来对图片进行添加链接。
定义一个a的标签,使用绝对定位,覆盖到"立即注册"上面,像这样:
<a href="#">立即注册</a>
然后我控制字体隐藏
div{
text-index:-9999px;
background-image:url("#");
display:block;
position:absolute;
}
background-image:url("#"); 这段代码主要是解决浏览器兼容性的。如果不加这句话的,在ie以下将不会起到作用,即还是点击不到。 接下来介绍一下另外几种隐藏文字的方法:
- display:none; 不为隐藏的对象保留物理占位空间
- visibility:hidden; 为隐藏的对象保留物理占位空间
css隐藏文字的小技巧的更多相关文章
- CSS技巧: CSS隐藏文字的方法(CSS text-indent: -9999px;)
建站过过程中朋友喜欢把网站名称用H1表示,但从美观考虑,要用logo图片来代替h1,这时需要隐藏h1内的这段文字,但又不能对搜索引擎不友好,否则就失去了定义h1标签的意义. 在CSS中如何以图代字,找 ...
- css选择器顺序的小技巧
在线演示 本地下载 css的选择器的顺序其实很有意思,如果应用的好的话,可以做一些简单的逻辑出来,配合上css3,就可以尽可能的脱离js了. 这里的演示是一个带有hover事件的四张照片,效果来自一个 ...
- css的几个小技巧
本文收录css设置样式的一些小技巧 1. 设置文字在块级标签居中(包括水平居中和垂直居中) 水平居中 方法一:使用text-align text-align:center 方法二:目标标签的父级标签设 ...
- CSS中的一下小技巧2之CSS3动画勾选运用
使用CSS3实现动画勾选 相信大家在项目中会经常遇到这种需求:勾选框.现在用CSS3来实现一个动画勾选,只需要一个标签即可完成: 这次需要用到CSS中伪类 after,这个小技巧也是很容易忘记的,所以 ...
- Android——隐藏输入法的小技巧
今天偶然在百度地图提供的DEMO里看到这样一段代码.认为确实是个小技巧,就写下来分享一下. 针对的问题: 我们在开发android界面的时候,常常使用EditText控件.然后每次进入这个页面的时候, ...
- CSS中的一下小技巧1之CSS3三角形运用
使用CSS3实现三角形: 在前端页面中有很多时候会遇到需要三角形图案的时候,以前不知道可以用CSS3实现三角形的时候,一般都是叫UI把三角形图案切出来. 后来知道原来可以用CSS3实现三角形,可是用过 ...
- 25条div+CSS编程提醒及小技巧整理
1.ul标签在Mozilla中默认是有padding值的,而在IE中只有margin有值. 2.同一个的class选择符可以在一个文档中重复出现,而id选择符却只能出现一次:对一个标签同时使用clas ...
- HTML+CSS - 前端设计的小技巧(持续更新......)
2015年7月6日20:28:20 1.设置文字的居中,非控件内的. :text-alain:center 2.图片在ASP.NET中,可以直接拖放到界面,自动形成img控件. 3.CSS直接在全局样 ...
- CSS绘制三角的小技巧
网页中常见一些三角形,使用css直接画出来就可以,不必做成图片或者字体图标当把一个盒子的高和宽的长度都设置为0,并且分别指定边框样式时,就会得到以下图形: 受此启发,可以知道三角是如何制作的(想要保留 ...
随机推荐
- 一个web应用的诞生(11)--在探首页
就要面对本章的一个难点了,说是难点可能仅仅对于我来说,毕竟我是一个js渣,既然首页打算使用动态加载的形式,那么与后台交互的方式就要进行选择,目前比较流行的为RESTful的形式,关于RESTful的文 ...
- JS里引用CSS属性时候的命名
如果JS代码中设置<p>元素的另一个CSS属性font-family.这个属性的获取方式与color属性略有不同,因为 font和family之间的连字符与JS中减法操作符相同,J ...
- 深度理解 Virtual DOM
目录: 1 前言 2 技术发展史 3 Virtual DOM 算法 4 Virtual DOM 实现 5 Virtual DOM 树的差异(Diff算法) 6 结语 7 参考链接 1 前言 我会尽量把 ...
- 关于Java中Arrays.sort()方法TLE
最近一直在练用Java写题,今天无意发现一道很简单的二分题(链接),我一开始是直接开int[]数组调用Arrays.sort()去排序,没想到TLE了,原来是因为jdk中对于int[]的排序是使用快速 ...
- Linux 系统管理06--磁盘管理
Linux系统管理06——磁盘管理 一.磁盘结构 1.硬盘的物理结构 盘片:硬盘有多个盘片,每个盘片2面 磁头:每面一个磁头 2.硬盘的数据结构 扇区:盘片被分为多个扇形区域,每个扇形区存放512字节 ...
- StringHelper--封转自己的字符串工具类
我们每次开发项目,都会有很多的关于字符串的处理,字符串的处理太常见了,无法避免,那么这时如果可以把常用的字符串处理封装成类,在以后的开发中应该会减少一些工作量,下面代码对一些常用的字符串处理进行了封装 ...
- Google Firebase Unity接入的坑
就说跑demo碰到的坑吧 https://firebase.google.com/docs/unity/setup 这是Firebase Unity的setup指南 大概写写步骤: 1. Fireba ...
- 在spring boot环境中使用fastjson + redis的高速缓存技术
因为项目需求,需要在spring boot环境中使用redis作数据缓存.之前的解决方案是参考的http://wiselyman.iteye.com/blog/2184884,具体使用的是Jackso ...
- Python CGI编程(转自易百)
Python CGI编程 Python的CGI编程,公共网关接口或CGI,Web服务器和一个自定义的脚本之间交换信息是一组定义的标准. 什么是CGI ? 公共网关接口或CGI,Web服务器和一 ...
- Homebrew - macOS 不可或缺的套件管理器
一.Homebrew 是什么? Unix/Linux 安装软件的时候有个很常见.也很令人头疼的事情,那就是软件包依赖.值得高兴的是,当前主流的 Linux 两大发行版本都自带了解决方案,Red hat ...