css如何实现让文字透明

html-css019

css如何实现让文字透明,第1张

方法是可以实现是,就是在链接a中的abc前后加一个span标签就可以了。

下面是完整的代码。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />

<title>无标题文档</title>

<style type="text/css">

a{text-decoration:none}

ul,li{list-style: nonemargin:0padding:0}

li.bg a span{visibility:hidden}

</style>

</head>

<body>

<div class="aa">

<ul>

<li class="bg"><a href="#"><span>abcdefghijk</span></a></li>

<li>隐藏的文字在左上角,鼠标放上去看看</li>

</ul>

</div>

</body>

</html>

PS:SEO中通过这样的方法Google会判断你是作弊的,所以最好不要用这种方法,如果你只是想在一个背景图片上面做链接,可以做一个1x1像素的gif透明图片,然后给写成<a href="#" class="mylink"><img src="images/spacer.gif" alt="abc" /></a>

其中的alt写成你要seo的信息,这样也能起来 seo 的作用,而且不会被认为是作弊。

再给你上面的class=aa这个div写一个position: relative,然后再给那个透明的gif图片链接所在层.mylink定义一个position: absolute,通过top和left来绝对定位链接的位置

再通过.mylink img{width: 100pxheight: 22px}的方法定义宽度和高度,这样就大功告成了。

需要准备的材料分别有:电脑、浏览器、html编辑器。

1、首先,打开html编辑器,新建html文件,例如:index.html。

2、在index.html中的<style>标签中,输入css代码:

div {opacity:0.5background-color: #0b93d5}  span {color: white}

3、浏览器运行index.html页面,此时成功在透明度50%的背景上显示了白色的文字。

这么简单的问题, 这个是CSS设置的, 设置该ID 或者CLASS下 鼠标在上面的时候背景颜色跟字体颜色就行了!

a:hover{background:#000opacity:0.5color:#fffdisplay:block}

这里只是把全部都写在一起了, 具体还要根据你表格的选择器来写! 要设置透明度 就用CSS的opacity设置! 字体颜色就是用color!