Question

我一直在这里寻找一些解决方案，但是我似乎很愚蠢地以所需的方式进行更改，因此我决定发表一篇文章。问题如下：

<div id="Castle_Properties">
  <div id="KingHeading">{KingVal}</div> 
  <div className="row">
    <div className="column">
        <div>Country</div>
        <div>Type</div>
        <div>Name</div>
        <div>Description</div>
        <div>Date Built</div>
    </div>
    <div className="column">
        <div>{countryVal}</div>
        <div>{typeVal}</div>
        <div>{nameVal}</div>
        <div>{descVal}</div>
        <div>{builtDateVal}</div>
    </div>
</div>

button {
  font-family: custom-bold;
  width: 100%;
  font-size: 1.1rem;
  outline: none;
  padding: 10px;
  background-color: rgba(0, 0, 0, 0.322);
  border: none;
  border-radius: 5px;
  color: white;
  box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.5);
  text-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.5);
}

button:hover {
  background-color:rgb(255, 255, 255);
  display: inline-block;
  transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  overflow: hidden;
  transition-property: color;
  transition-duration: 0.5s;

  color:rgb(0, 0, 0);
  
}

当您将鼠标悬停在它上面时，它会闪烁。例如，当我向其添加1％的边距顶部时，我会防止闪烁，但会与我所做的其他操作有关。任何想法我能做些什么来在不增加利润的情况下实现它吗？问候！

Answer 1

您只需过渡颜色，将其更改为“全部”就可以了。并将其添加到按钮类中以进行相反的操作。

button {
  font-family: custom-bold;
  width: 100%;
  font-size: 1.1rem;
  outline: none;
  padding: 10px;
  background-color: rgba(0, 0, 0, 0.322);
  border: none;
  border-radius: 5px;
  color: white;
  box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.5);
  text-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.5);
    transition-property: all;
  transition-duration: 0.5s;
}

button:hover {
  background-color:rgb(255, 255, 255);
  display: inline-block;
  transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  overflow: hidden;
  transition-property: all;
  transition-duration: 0.5s;

  color:rgb(0, 0, 0);
  
}

<button>thatsabutton</button>

当我将鼠标悬停在按钮上时，HTML / CSS会闪烁

1 个答案: