为什么当我将鼠标悬停在文本框上时,它不会影响背景

时间:2016-10-05 02:24:51

标签: html css

如果您将鼠标悬停在此网站http://motivationalblogging.com/上的某个帖子上,则会缩放。我让缩放工作,但只要我将鼠标悬停在出现的文本上,缩放就会停止。我已经尝试过各种不同的方式来保持背景变焦,但无法弄清楚原因。

三江源

1 个答案:

答案 0 :(得分:0)

a:link {
  color: black;
}

a:visited {
color: gray;
}

a:hover {
  color: pink;
}

a:active {
  color: yellow;
}

.background-switch {
  text-align: center;
  padding: 1em;
  max-width: 250px;
  font-size: 2.2em;
  border-radius: 30px;
  background-color: pink;
}
.background-switch:hover {
  background-color: lightblue;
  color: white;

}

.hover-rotate { margin-left: 30px; }

.hover-rotate:hover {
  -ms-transform: rotate(-10deg);
  -webkit-transform: rotate(-10deg);
  -moz-transform: rotate(-10deg);
  -o-transform: rotate(-10deg);
  transform: rotate(-10deg);

}

.hover-outline { 
  margin-left: 30px;
  margin-top: 10px;
}

.hover-outline:hover {
  outline: 5px solid gray;
  outline-offset: 10px;
}
<h1><a href="http://www.fakesite.doesnt-exist.com-tk"> </a></h1>
<p class="background-switch">Ok, now that you've done that, hover me next!</p>