在Div上加一个超链接,JavaScript VS Css?
前一段时间我为一个DIV上加链接而苦恼,到底用啥样的技术那?JavaScript VS Css?
用<a></a>把DIV内容包含进去进行超链接是不明智的选择,再说也不符合WEB标准。我想何必用<a>标记那!实际上在DIV的onclick属性上加一段JavaScript小脚步就行了,但是你的浏览器要支持JavaScript脚步。
即使无法运行脚本,另一个解决方法是在DIV块里用<a></a>超链接呀,一样可以链接到目的地,岂不是完美。
好了,不多说了,那就开始我们的小应用吧!
关键代码是:
location.href=’http://www.blog.moocss.com/’
Html Code :
1 2 3 | <div id="header" style="cursor:pointer;" onclick="location.href='http://www.blog.moocss.com/';"> <a href="#"></a> </div> |
Css Code :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | #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美化一下。
文章评论 已经有 0 条评论!