首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

在Div上添一个超链接

2013-10-02 
在Div上加一个超链接在Div上加一个超链接,JavaScript VS Css? ?Written by Rainbow On 2009-04-18 With 0

在Div上加一个超链接
在Div上加一个超链接,JavaScript VS Css? ?
Written by Rainbow On 2009-04-18 With 0 Comments
前一段时间我为一个DIV上加链接而苦恼,到底用啥样的技术那?JavaScript VS Css?

用<a></a>把DIV内容包含进去进行超链接是不明智的选择,再说也不符合WEB标准。我想

何必用<a>标记那!实际上在DIV的onclick属性上加一段JavaScript小脚步就行了,但是

你的浏览器要支持JavaScript脚步。

即使无法运行脚本,另一个解决方法是在DIV块里用<a></a>超链接呀,一样可以链接到

目的地,岂不是完美。

好了,不多说了,那就开始我们的小应用吧!

关键代码是:

location.href=’http://www.blog.moocss.com/’    ---cursor:hand;只对ie有效   (层上加div显示个小手形状)建议用:style="cursor:pointer;"---在新窗口打开链接---<div onClick="javascript:window.open('#','_blank')"></div>        ---<a href="http://www.soso.com">把那段动态代码嵌在中间</a>Html Code :<div id="header" style="cursor:pointer;" onclick="location.href='http://www.blog.moocss.com/';"> <a href="#"></a> </div>


Css Code :
#header {width: 300px;height: 100px;border: 4px solid #996600;background-color: #FFCC62;}#header a {display: block;width: 100%;height: 100%;text-decoration: none;cursor: pointer;}#header a:hover {text-decoration: none;background-color: #FFE0A2;}

到了最后我在多说几句,这个小技术还可以应用到,用Div包含的整个文字或者用DIV作

的按钮都可以轻松做超链接。

此技术换可以在HTML的其它标记上应用,只要支持onclick事件就行了。再用CSS美化一

下。(引自:http://blog.moocss.com/tutorials/html-css-tutorials/38.html)

热点排行