zoukankan      html  css  js  c++  java
  • css隐藏文字的小技巧

    前段时间,在做项目的时候,遇到一个问题。背景图片上有一个“立即注册”的按钮,需要点击。但是问题是:现在的图片是背景图片,如果图片是在html页面内的话,我们可以使用锚点来对图片添加链接。这个时候,我们就可以使用隐藏文字的方法来对图片进行添加链接。

    定义一个a的标签,使用绝对定位,覆盖到"立即注册"上面,像这样:

    1. <a href="#">立即注册</a>

    然后我控制字体隐藏

    div{
    text-index:-9999px;
    background-image:url("#");
    display:block;
    position:absolute; }
    background-image:url("#");   这段代码主要是解决浏览器兼容性的。如果不加这句话的,在ie以下将不会起到作用,即还是点击不到。

    接下来介绍一下另外几种隐藏文字的方法:
    1. display:none; 不为隐藏的对象保留物理占位空间
    2. visibility:hidden; 为隐藏的对象保留物理占位空间
  • 相关阅读:
    11111
    JavaScript基础
    CSS使用
    CSS 基本
    前端之HTML
    Python 迭代器和生成器
    Python day11
    Python 函数
    第十七篇:django基础(二)
    第十六篇:django基础
  • 原文地址:https://www.cnblogs.com/maxiaodan/p/5336995.html
Copyright © 2011-2022 走看看