css - 在悬停跨度样式上显示 div

标签 css html

标题可能有点误导。

http://jsfiddle.net/whb8A/

我在 span 标签内有一个 h3 元素,当然它不应该放在那里,但是我似乎无法按照我想要的方式在 div 中设置跨文本的样式。

如果您将鼠标悬停在 jsfiddle 中的图像上,则会显示隐藏的 div,这正是我想要的样子,但是如果我将 h3 标签从文本中移除,我似乎无法使用 CSS 对其进行样式设置.

我应该考虑使用 Jquery 替代品吗?如果是这样,任何指南教程都会很棒,谢谢

更新:感谢到目前为止的所有帮助,但我认为我解释得不是很好。

http://imageshack.us/photo/my-images/827/examplewc.jpg/

左侧是我希望它的样式,但是删除 h3 标签并从类 .info 中删除 h3 会使它的样式与右侧相同。我最关心的是border width、position和padding

最佳答案

另一种解决方案是将文本样式定义直接放在 <a> 下标签,以覆盖默认的 anchor 标签样式。示例:

.featured a {
    color: #fff;
    text-transform: uppercase;
}

关于css - 在悬停跨度样式上显示 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6285891/

相关文章:

html - 并排创建两个高度为 100% 的 float div

javascript - 使用 JavaScript 更改 IE 中的背景图像

css - 使用 css 垂直流动的文本

html - 为什么要有双底边框?

html - 图像按比例填充 div 而不使用背景大小 : cover or object-fit: cover

html - 使用窄间隙的 Flexbox 将列表拆分为 3 组

javascript - 使用 JavaScript 的 Directions Google Map API

html - 如何创建两个 li 样式?

javascript - 使用 Adob​​e Edge 为 Phonegap 自定义字体

jquery - HTML5 内容可使用 jQuery 编辑