Question

我是HTML / CSS的新手，但我在修复固定的h1元素方面遇到了麻烦。它拒绝自我中心并坚持页面的左侧。我已经尝试将保证金设置为自动，但它没有做任何事情。这是代码：

h1 {
color: #580101;
font-family: RobotoRegular;
position: fixed;
text-align: center;
}

* {
 background-color: #ecebe9;
 }

#navbar {
color: #000653;
background-color: #00001a;
height: 40px;
border-radius: 3px;
}

.sidebar {
background-color: black;
width: 90px;
height: 500px;
float: left;
margin: 30px 0px 0px 0px;
}

HTML：

<!DOCTYPE html>
<html>
<head>
    <link href="Fonts/stylesheet.css" rel="stylesheet" type="text/css">
    <title>Webpage</title>
</head>
<body>
    <div id="navbar"></div>
    <div class="sidebar"></div>
    <h1>Hello World!</h1>
</body>
</html>

那么，我该怎么办？

Answer 1

<强> DEMO

将 <h1> position:fixed更改为position:relative

Answer 2

如果您想使用固定位置，请为width: 100%; css样式添加h1 css规则。

其他只需删除可行的position。

Answer 3

它坚持页面的原因是因为它的名称固定在例如。如果你“基本上”要求修复元素，如果这是有意义的话，你不能告诉它在中心自由浮动

你可以这样做

<style>
.test{
   position:fixed; 
   right:0; 
   left:0; 
   text-align:center; 
   background:#EEEEEE;
</style>
<h1 class="test">test</h1>

Answer 4

使用position时，请指明其位置... left，top或right，bottom。

如何固定固定元素？

4 个答案: