css 如何将回车键的位置更改为页面中心？

czfnxgou 于 2023-01-27 发布在其他

关注(0)|答案(4)|浏览(109)

如何将按钮从页面的顶角移到页面的中心

.button {
  background-color: rgb(168, 229, 70);
  width: 200px;
  font-size: 20px;
  padding: 5px;
  border-radius: 5px;
  border: 3px solid yellow;
  color: white;
  text-align: center;
}

<a href="">
  <div class="button">enter</div>
</a>
<!--insert a link that take to a page that has info about the developers
    -->

我不知道该怎么做？

css

来源：https://stackoverflow.com/questions/75237414/how-to-change-the-postion-of-the-enter-button-to-the-centre-of-the-page

4条答案

按热度按时间

4bbkushb1#

添加此内容应该可以完成此操作

.button {
      display: block;
      margin: auto; }

赞(0）回复(0）举报 2023-01-27

mwg9r5ms2#

这将使您的按钮进入页面的中心。

.center{
  height : 100vh;
  width : 100vw;
  display : grid;
  align-items : center;
  justify-content : center;
}

<div class="center">
<button><a href="https://stackoverflow.com">Hi There</a></button>
</div>

赞(0）回复(0）举报 2023-01-27

0sgqnhkj3#

您可以添加以下内容：
.按钮{

margin: auto;

}
或者这个：

.button {
    margin-left:25%;
    margin-right:25%;
}

赞(0）回复(0）举报 2023-01-27

omtl5h9j4#

.button {
  background-color: rgb(168, 229, 70);
  width: 200px;
  font-size: 20px;
  padding: 5px;
  border-radius: 5px;
  border: 3px solid yellow;
  color: white;
  text-align: center;
  position:fixed;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%)
}

<a href="">
  <div class="button">enter</div>
</a>
<!--insert a link that take to a page that has info about the developers
    -->

赞(0）回复(0）举报 2023-01-27

我来回答

css 如何将回车键的位置更改为页面中心？

4条答案

相关问题

热门标签

最新问答