html的悬停是什么回事,html – 如何更改悬停内容

我一直在玩这个，我以为这会很简单。我想要做的是将鼠标悬停在“新”标签上。一旦处于悬停状态，只需使用CSS将内容从“NEW”更改为“ADD”。

body{

font-family: Arial, Helvetica, sans-serif;

}

.item{

width: 30px;

}

a{

text-decoration:none;

}

.label {

padding: 1px 3px 2px;

font-size: 9.75px;

font-weight: bold;

color: #ffffff;

text-transform: uppercase;

white-space: nowrap;

background-color: #bfbfbf;

-webkit-border-radius: 3px;

-moz-border-radius: 3px;

border-radius: 3px;

text-decoration: none;

}

.label.success {

background-color: #46a546;

}

.item a p.new-label span{

position: relative;

content: 'NEW'

}

.item:hover a p.new-label span{

display: none;

}

.item:hover a p.new-label{

content: 'ADD';

}

New

这是一个JSFiddle，告诉你我正在工作。