你的位置:首页 > 网页设计

[网页设计]css实现table中td单元格鼠标悬浮时显示更多内容


table中,td单元格无法显示下全部内容,需要在鼠标hover时显示全部内容。

正常显示样式:

鼠标hover时:

html:

<td>displayAddress<span class="tdtip">popAddress</span></td>

css:

td{  position:relative;   z-index:2;}td:hover{  z-index:3;  background:none; }td .tdtip {  display: none;}td:hover .tdtip {   display: block;  position: absolute;  top: 8px;   background-color: whitesmoke;  color: royalblue;  word-break: break-all;}