如何在 CSS 中移动元素(即 div、头部、body)并正确更改背景颜色

您好，所以我在使用 css 时遇到了问题，我正在尝试移动它并更改背景颜色，但我似乎无法这样做，但我能够更改它的其他属性，例如居中和权重

蟒蛇文件：

from flask import Flask, request, render_template
app = Flask(__name__)

@app.route('/homepage')
def homepage():
return render_template('homepage.html')
if __name__ == "__main__":
app.run(debug=True)

html 文件：

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" type="text/css" href="{{url_for('static',filename='homepage.css')}}">
  <link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
    <div class="navbar">
      <h1 id=home>Home <h2>
      <h1 id=about>About <h2>
      <h1 id=location>Location <h2>
    </div>
  <h1 id=logo>4/12</h1>
</head>
<body>
  <h1> welcome to the homepage</h1>
</body>

CSS 页面：

  background-color: #333333;
}
#logo{
  position: relative;
}
#home{
  font-family: 'Raleway', sans-serif;
  text-align: center;
}
#about{
  font-family: 'Raleway', sans-serif;
}
#location{
  font-family: 'Raleway', sans-serif;
}

将您的导航放在正文中屏幕上显示的所有HTML代码都会进入正文。

接下来，在 CSS 中的背景颜色上放置一个正文标签。

body{
  background-color: #333333;
}
#logo{
  position: relative;
}
#home{
  font-family: 'Raleway', sans-serif;
  text-align: center;
}
#about{
  font-family: 'Raleway', sans-serif;
}
#location{
  font-family: 'Raleway', sans-serif;
}

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" type="text/css" href="{{url_for('static',filename='homepage.css')}}">
  <link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
</head>
<body>
     <h1> welcome to the homepage</h1>
      <div class="navbar">
      <h1 id=home>Home <h2>
      <h1 id=about>About <h2>
      <h1 id=location>Location <h2>
    </div>
  <h1 id=logo>4/12</h1>
</body>

相关内容

最新更新

热门标签：