添加跳转链接_html/css_WEB-ITnose

    <meta charset="UTF-8">    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">    <title> 页面名称 </title><style type="text/css">td:hover {    position: relative;}td:hover:before {    content: attr(data-title);    position: absolute;    left: 5px;    top: 100%;    background: #330099;    color: #99FFFF;    border: 1px solid #00FF00;    border-radius: 5px;    box-shadow: 3px 3px 3px #666666;}</style><table><tbody><tr><td data-title="aaaa">1111</td><td data-title="bbbb">2222</td><td data-title="cccc">3333</td></tr></tbody></table>

回复讨论(解决方案)

给aaaa添加a标签

给aaaa添加a标签

onclick="location=..."

因为:after 和:before伪元素不是真实的dom元素，只是实现了一些特定的效果，无法绑定事件
要绑定事件只能改用真实的dom元素了

因为:after 和:before伪元素不是真实的dom元素，只是实现了一些特定的效果，无法绑定事件
要绑定事件只能改用真实的dom元素了

    <meta charset="UTF-8">    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">    <title> 页面名称 </title><style type="text/css">td {    position: relative;}td .tbox {    position: absolute;    left: 5px;    top: 100%;    background: #330099;    color: #99FFFF;    border: 1px solid #00FF00;    border-radius: 5px;    box-shadow: 3px 3px 3px #666666;    text-decoration: none;    display: none;}td:hover .tbox {
display: block;}</style>

    <meta charset="UTF-8">    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">    <title> 页面名称 </title><style type="text/css">td {    position: relative;}td .tbox {    position: absolute;    left: 5px;    top: 100%;    background: #330099;    color: #99FFFF;    border: 1px solid #00FF00;    border-radius: 5px;    box-shadow: 3px 3px 3px #666666;    text-decoration: none;    display: none;}td:hover .tbox {
display: block;}</style>

你这个是个提示，是个属性！你自己要对此有些封装。使用div自己封装一个提示框