时间戳

首页 > 解决方案 > 为什么我不能为锚元素设置样式？

html - 为什么我不能为锚元素设置样式？

问题描述

这是我所有的代码（代码看起来很乱，因为我大约 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>

标签： htmlcsshyperlinkstyleshref

解决方案

if you mean underline of link for that you can use the method text-decoration for examplea{text-decoration:none} this code will remove any decorations of a tag so if you wanna use this function for all a tags you will write a{text-decoration:none} so if you wanna set decoration of specific tag you can give a class on the tag before you can change something 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;
}

推荐阅读