为什么我不能设置锚元素的样式？
[英]Why can't I style anchor elements?
问题描述
这是我所有的代码（代码看起来很乱，因为我大约 2/3 周前才开始学习）。 我似乎无法设置锚元素的样式。 我什至试过给它们上课，但它也不起作用。 我对这件事有点陌生。
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@700&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Bree+Serif&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Inter:wght@500&display=swap'); body { height: 100%; margin: 0; padding: 0; background: #bbb; } .ex-house { padding: 0; display: block; margin: 0 auto; max-height: 100%; max-width: 100%; opacity: 0.8; } .house-dh { position: absolute; top: -20%; left: 2%; padding: 0px; margin: 0px; color: rgb(255, 255, 255); font-family: 'Bree serif'; font-size: 125px; text-align: center; text-shadow: 2px 2px 3px rgba(255, 255, 255, 0.1); } .about-gnco1 { position: absolute; color: rgb(255, 255, 255); font-family: 'Inter'; font-size: 35px; text-align: left; margin: 0px; padding: 0px; left: 2%; top: 20%; text-shadow: 2px 2px 3px rgba(255, 255, 255, 0.1); } /* this is my code for the style element i think i did it right but when i run it. the a href element dosent change */ .front-button { font-family: 'Bebas Neue'; font-size: 20px; color: white; text-shadow: 2px 2px 3px rgba(255, 255, 255, 0.1); } .front-button a { margin: 0 20px; }
<body> <div class="front"> <img class="ex-house" src="https://via.placeholder.com/80" alt="dreamhouse"> <div class="house-dh"> <p>grandnew.co</p> </div> <div class="about-gnco"> <p class="about-gnco1">Is here to help you<br> build your own<br> Dream House.</p> </div> </div> </div> <div class="front-button"> <a href="#">CUSTOMIZE</a> <a href="#">DESIGNS</a> <a href="#">PLANS</a> <a href="#">ABOUT US</a> </div> </body>
2 个解决方案
解决方案1
1 2021-10-08 18:14:21
如果您的意思是链接的下划线，您可以使用方法 text-decoration 例如a{text-decoration:none}此代码将删除标签的任何装饰，因此如果您想对所有标签使用此功能，您将编写a{text-decoration:none}所以如果你想设置特定标签的装饰，你可以在标签上给出一个类，然后才能改变一些example
HTML
<a href="https://stackoverflow.com">go to stackoverflow</a>
<a class="a-tag" href="https://stackoverflow.com">go to stackoverflow</a>
CSS
a{ //for all <a> tags
text-decoration:none
}
.a-tag{ // only for tag who have the a-tag class
text-decoration:none
color:black;
}
解决方案2
1 2021-10-08 18:44:54
这对我有用。 '.front-button a' 中的文本样式，而不是 '.front-button'
.front-button a {
margin: 0 20px;
font-family: 'Bebas Neue';
font-size: 20px;
color: red;
text-shadow: 2px 2px 3px rgba(241, 238, 53, 0.5);
}
有关链接样式的更多信息：
无法<a>使用图片设置</a>锚样式
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.