时间戳

首页 > 解决方案 > 如何将 div 及其内容移动到中间

html - 如何将 div 及其内容移动到中间

问题描述

我正在尝试使按钮和文本彼此相邻，但我需要将其居中。align="center"对我也不起作用。

function flee() {
  console.log("flee");
}
body {
  background-color: powderblue;
}

.p1 {
  color: blue;
  border-bottom: 5px solid black;
  margin: 0;
}

.p2 {
  color: red;
  margin: 0;
  padding-top
}

.label1 {
  color: black;
}

.footer-nav {
  align-items: center;
  display: flex;
}

.wrap {
  display: block;
  align-items: center
}

.button1 {
  background-color: green;
  color: powderblue;
  border-width: 0;
  margin-left: 50px;
}
<p class="p1" align="center">
  <font size="10">Welcome To Plieaxploits!</font>
</p>
<p class="p2" align="center">
  <font size="5">We Are The Home Of Roblox Exploits!</font>
</p>
<p class="p1" align="center">
  <font size="3.5">Simply Click The Button Next To The Script You Want And CLick Skip AD!</font>
</p>

<div class="footer-nav" align="center">
  <p class="label1">
    <font size="4" face="cursive">Flee The Facility GUI</font>
  </p>
  <button class="button1" onclick="flee()">
    <font size="4" face ="cursive">GO!</font>
  </button>
</div>

标签： htmlcss

解决方案

.p1 {
  color: blue;
  border-bottom: 5px solid black;
  margin: 0;
}

.p2 {
  color: red;
  margin: 0;
  padding-top
}

.label1 {
  color: black;
}

.footer-nav {
  align-items: center;
  display: flex;
  justify-content: center;
}

.wrap {
  display: block;
  align-items: center
}

.button1 {
  background-color: green;
  color: powderblue;
  border-width: 0;
  margin-left: 50px;
}
<head>
  <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
</head>

<body style="background-color:powderblue;">

  <p class="p1" align="center">
    <font size="10">Welcome To Plieaxploits!</p>
  <p class="p2" align="center">
    <font size="5">We Are The Home Of Roblox Exploits!</p>
  <p class="p1" align="center">
    <font size="3.5">Simply Click The Button Next To The Script You Want And CLick Skip AD!</font>
  </p>

  <div class="footer-nav">
    <p class="label1">
      <font size="4" face="cursive">Flee The Facility GUI</font>
    </p>
    <button class="button1" onclick="flee()"><font size="4" face ="cursive">GO! </font>
    </button>
  </div>
</body>

推荐阅读