英文:
How to specify all links with a certain pattern with CSS
问题
#p1 a, #p2 a, #p3 a, #p4 a, #p5 a, 等等。
我有成千上万个它们。
如何使用CSS指定它们所有？
尝试过 #p*
尝试过 id^="p"
英文:
#p1 a,#p2 a,#p3 a,#p4 a,#p5 a, etc.
I have thousands of them.
How can I specify all of them with CSS
tried #p*
tried id^="p"
答案1
得分: 3
Works for me.
[id^="p"] a {
color: red;
}
[id^="z"] a {
color: green;
text-decoration: none;
}
[id^="z"] a:hover {
color: blue;
text-decoration: underline;
}
<p id="p1"><a href="">P One</a></p>
<p id="p2"><a href="">P Two</a></p>
<p id="p3"><a href="">P Three</a></p>
<p id="p4"><a href="">P Four</a></p>
<p id="z1"><a href="">Z One</a></p>
<p id="z2"><a href="">Z Two</a></p>
<p id="z3"><a href="">Z Three</a></p>
<p id="z4"><a href="">Z Four</a></p>
But I'm sure you could find a better selector than "id starts with p". Giving all the relevant links a class would seem a more robust solution.
英文:
Works for me.
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-css -->
[id^="p"] a {
color: red;
}
[id^="z"] a {
color: green;
text-decoration: none;
}
[id^="z"] a:hover {
color: blue;
text-decoration: underline;
}
<!-- language: lang-html -->
<p id="p1"><a href="">P One</a></p>
<p id="p2"><a href="">P Two</a></p>
<p id="p3"><a href="">P Three</a></p>
<p id="p4"><a href="">P Four</a></p>
<p id="z1"><a href="">Z One</a></p>
<p id="z2"><a href="">Z Two</a></p>
<p id="z3"><a href="">Z Three</a></p>
<p id="z4"><a href="">Z Four</a></p>
<!-- end snippet -->
But I’m sure you could find a better selector than "id starts with p". Giving all the relevant links a class would seem a more robust solution.
答案2
得分: 0
你正在为<a>标签添加样式，所以在所有的id后面，像下面这样添加后代组合选择器**"a"**：
[id^="p"] a {
color: "red";
}
英文:
You are styling on <a> tag so after all id put descendant combinators selector "a" like below
[id^="p"] a{
color: "red";
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论