为什么h1标签在我的CSS中没有很好的响应？

yhuiod9q 于 2023-05-30 发布在其他

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

基本上这就是代码。
CSS

*{
    margin:0;
    padding:0;
    font-family:sans-serif;
background-size:cover;
}

.login-box{
  width:280px;
  position:absolute;
  top:50%;
  left:50%;
  transform :translate(-50%,-50%);
  color:white;  
}
 .login-box h1{
  float:left;
  font-size:40px;
  border-bottom: 6px solid;

}

html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title> Transparent Login Form</title>

    <link rel="stylesheet" href="style2.css">

  </head>
  <body>

    <div class="login-box">
      <h1>Login</h1>

      <div class="textbox">
        <input type="text" placeholder="Username" name="" value="">
      </div>

<div class="textbox">

<input type="password" placeholder="Password" name="" value="">

</div>

<input class="btn" type="button" name="" value="Sign in">

</div>

  

  </body>
</html>

为什么H1不支持CSS？
我不明白为什么在这里使用浮动。不就是为了把图片和文字对齐吗
链接到视频，我正在学习这个from.https://www.youtube.com/watch?v=ooc6f1w6Mzg&t=54s

css

来源：https://stackoverflow.com/questions/74967590/why-h1-tag-not-responding-well-in-my-css

4条答案

按热度按时间

fafcakar1#

CSS正在工作，如果它在您的浏览器中不工作，请重新加载或重新启动服务器

* {
      margin: 0;
      padding: 0;
      font-family: sans-serif;
      background: url(smoky.jpg) no-repeat;
      background-size: cover;
    }
    
    .login-box {
      width: 280px;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      color: white;
    }
    h1 {
      float: left;
      font-size: 40px;
      color: red;
      border-bottom: 6px solid;
    }

赞(0）回复(0）举报 2023-05-30

dgenwo3n2#

检查这一行，stylesheet是否正确链接
link rel=“stylesheet”href=“style2.css”

赞(0）回复(0）举报 2023-05-30

3mpgtkmj3#

body {
  margin: 0;
  padding: 0;
  font-family: sans-serif;
  background: url(smoky.jpg) no-repeat;
  background-size: cover;
}

.login-box {
  width: 280px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: black;
}
.login-box > h1 {
  float: left;
  font-size: 40px;
  border-bottom: 6px solid;
  color: brown;
}

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Static Template</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    
    <div class="login-box">
      <h1>Login</h1>

      <div class="textbox">
        <input type="text" placeholder="Username" name="" value="">
      </div>

      <div class="textbox">

      <input type="password" placeholder="Password" name="" value="">

      </div>

      <input class="btn" type="button" name="" value="Sign in">

      </div>
  </body>
</html>

赞(0）回复(0）举报 2023-05-30

wj8zmpe14#

body{
    margin:0;
    padding:0;
    font-family:sans-serif;
    background: url(smoky.jpg) no-repeat;
background-size:cover;
}

.login-box{
  width:280px;
  position:absolute;
  top:50%;
  left:50%;
  transform :translate(-50%,-50%);
  color:white;  
}
 .login-box ,h1{
  float:left;
  font-size:40px;
  border-bottom: 6px solid;

}

hello sir here we should use the coma "," for the middle of login-box and the h1 tag

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Static Template</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    
    <div class="login-box">
      <h1>Login</h1>

      <div class="textbox">
        <input type="text" placeholder="Username" name="" value="">
      </div>

      <div class="textbox">

      <input type="password" placeholder="Password" name="" value="">

      </div>

      <input class="btn" type="button" name="" value="Sign in">

      </div>
  </body>
</html>

赞(0）回复(0）举报 2023-05-30

我来回答

为什么h1标签在我的CSS中没有很好的响应？

4条答案

相关问题

热门标签

最新问答