如何将页面上按钮的高度相对于HTML中的页面高度居中?

时间:2017-05-23 03:15:51

标签: html css

我在谷歌上已经找了很长一段时间,但我似乎无法找到关于如何将页面上的按钮相对于页面高度居中的直接答案。我可以使用“margin:0 auto”样式执行此操作。有没有类似的方法来做这个高度?

P.S。密码的1234

/* Login */
function enter() {
   var pass = prompt("Enter the Password");
{
if (pass == "1234") 
{
    alert("Correct");
  location.href="Page2.html"
}
    
else
{
    if (pass == null)
        {
            throw '';
        }
    else
    {
    alert("Incorrect");
    }
}}}
/* Body Styles */
body {
    background-color: #00C5CD;
}

/* Defining Fonts */
    @font-face {
    font-family: "CinnabarBrush";
    src: url("CinnabarBrush.ttf");
}


/* Button Styles */
button#enter {
    background-color: #FF4444;
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    display: block;
    font-size: 16px;
    margin: 0 auto;
   display: block;
}


/* Header1 (title) Styles */
h1#title {
    font-size: 50pt;
    color: #fff;
    font-family: "CinnabarBrush";
  height: auto;
  text-align: center;
  text-shadow: 
    -5px -5px 0 #000,
    5px -5px 0 #000,
    -5px 5px 0 #000,
    5px 5px 0 #000;
<!DOCTYPE html>
<html>
<head>
    <title>Cinnabar Web</title>
     <link rel="stylesheet" href="CSS.css">
    <script src="JavaScript.js"></script>
</head>
<body>
    <h1 id="title">Cinnabar Web</h1>
      <button id="enter" onclick="enter()">Enter</button>
</body>
</html>

0 个答案:

没有答案