gpt4 book ai didi

html - 如何为特定的 anchor 标记或 div 设置纯 html 标题的样式?

转载 作者:行者123 更新时间:2023-11-28 15:56:43 26 4
gpt4 key购买 nike

我正在尝试为链接设置标题(不是工具提示)的样式。但我不知道如何设置它的样式。

我的代码在这里。我不想通过添加伪元素以及前后元素来设置样式。

<!DOCTYPE html>
<html lang="en-US">


<body>

<h2>Link Titles</h2>
<p>The title </p>
<a href="#" title="this is the title i want to style">Visit our HTML Tutorial</a>



</body>
</html>

当您将鼠标悬停在 anchor 标记上时,如何设置显示的标题样式。

最佳答案

您不能直接设置样式,但可以使用伪元素创建相同的效果。

a[myTitle]:hover {
position: relative;
}

a[myTitle]:hover:after {
content: attr(myTitle);
position: absolute;
left: 0;
top: 100%;
background: #000;
color: #fff;
padding: .5rem 1rem;
z-index: 1000;
white-space: nowrap;
}
<h2>Link Titles</h2>
<p>The title </p>
<a href="#" myTitle="this is the title i want to style">Visit our HTML Tutorial</a>

关于html - 如何为特定的 anchor 标记或 div 设置纯 html 标题的样式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50712941/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com