如何用css屏蔽a标签title

html-css014

如何用css屏蔽a标签title,第1张

用CSS应该屏蔽不了a标签title。如果不想title显示可以从HTML里删除title，如果想让title对搜索引擎有效，那可以在载入网页后用javascipt删除a标签的title。

你可以通过onmouseover事件来show一个内容为title的自定义box给这个box啦定义样式。

------解决方案--------------------------------------------------------<style#tooltip{border:1px solid redbackground:#FF6

position:absolute

padding:1px

color:#333

display:none}</style<script type=text/javascript src=scripts/jquery-1.7.1.min.js</script

<script type=text/javascript

$(function(){var x=10var y=20$(a.tooltip).mouseover(function(e){

this.myTitle=this.title

this.title=

var tooltip=<div id='tooltip'+this.myTitle+</div //创建DIV元素

$(#link).append(tooltip) //追加到文档中

$(#tooltip).css({top: (e.pageY+y) + px,left: (e.pageX+x) + px}).show() //设置X Y坐标， 并且显示

}).mouseout(function(){

this.title=this.myTitle

$(#tooltip).remove() //移除

}).mousemove(function(e){

$(#tooltip).css({top: (e.pageY+y) + px,left: (e.pageX+x) + px})})})</script

<title超链接提示效果</title</head<body<div id=link

<p<a href=# class=tooltip title=这是我的超链接提示1提示1</a</p

<p<a href=# class=tooltip title=这是我的超链接提示2提示2</a</p

<p<a href=# title=这是我的超链接提示1自带提示1</a</p

<p<a href=# title=这是我的超链接提示2自带提示2</a</p</div</bodyjq写的， 你看看是不是你想要的那种效果， 提示框的样式可以自己更改的。。

嗯，你应该说的是高级选择器，你说的那个是子对像选择符：

body>p{color:#f00}

*{color:#00f}/*通配符*/

a[title]{color:#0f0}

或

a[title="1213"]{color:#ff0}

像上面用中括号的是“属性选择符”

如下面的：

<a

href="#">这里不显示颜色</a>

<a

href="#"

title="567">这里的颜色为#0f0</a>

<a

href="#"

title="1213">这里的颜色为#ff0</a>

body+p{color:#f00}/*相邻选择符*/

<body>

<p>这里显示的颜色为#f00</p>

<div><p>这里显示的颜色为浏览器默认颜色</p></div>

</body>

其它的一般的选择符就不说了。