更改 CSS 链接访问悬停在 html 部分中处于活动状态

发布于 2024-10-03 03:10:46 字数 563 浏览 2 评论 0原文

我想做一个动态词云，我想知道是否有一种方法可以更改我的 html 部分中的链接颜色，通常你只需在 css 中定义链接颜色，例如：

.tag_cloud { padding: 3px; text-decoration: none; }
.tag_cloud:link  { color: #0c3569; }
.tag_cloud:visited { color: #0c3569; }
.tag_cloud:hover { color: #ffffff; background: #0c3569; }
.tag_cloud:active { color: #ffffff; background: #0c3569; }

但我计划做一个词云每个单词都有不同的颜色，又名 link/visited 将颜色定义为动态的，但是有没有办法在 html 中定义 link/visited/hover/active 内联？

我想象它可能是这样的

<a href="something" style="font:arial; ???"word</a>

谢谢。

原文

I want to do a dynamic word cloud and I was wondering if there is a way of changing the link colour in my html section, normally you just define the links colours in css something like:

.tag_cloud { padding: 3px; text-decoration: none; }
.tag_cloud:link  { color: #0c3569; }
.tag_cloud:visited { color: #0c3569; }
.tag_cloud:hover { color: #ffffff; background: #0c3569; }
.tag_cloud:active { color: #ffffff; background: #0c3569; }

But I'm planning to do a word cloud were every word has a different colour, aka link/visited will colour will be defined dinamicaly, but is there a way of defining link/visited/hover/active inline in the html?

I Imagine it could be something like this

<a href="something" style="font:arial; ???"word</a>

Thanks.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

农村范ル 2024-10-10 03:10:46

它不能内联完成，因为 :hover 等是 css 伪选择器，并且不会内联工作，因为这不是它的意图。

但不要害怕使用 css 类 - 无论如何你都需要一些 javascript 来完成这项工作。只需定义您想要使用的类，例如：

.cloud_item_1:link {color:red;}
.cloud_item_1:visited {color:yellow;}
.cloud_item_1:hover {text-decoration:underline;}
.cloud_item_1:active {color:black;}
.cloud_item_2:link {color:blue;}
.cloud_item_2:visited {color:orange;}
...

然后将它们应用到您的 html 中。这里没什么大不了的。

It can't be done inline since :hover etc. are css pseudo selectors and won't work inline since that is not the intention of it.

But don't be afraid of using css classes - you will need some javascript anyway to make this work. Just define the classes you want to use like:

.cloud_item_1:link {color:red;}
.cloud_item_1:visited {color:yellow;}
.cloud_item_1:hover {text-decoration:underline;}
.cloud_item_1:active {color:black;}
.cloud_item_2:link {color:blue;}
.cloud_item_2:visited {color:orange;}
...

And than apply them to your html as you wish. No big deal here.

回复收藏 0 原文