gpt4 book ai didi

html - 如何使用 HTML CSS 使图像居中

转载 作者:行者123 更新时间:2023-11-28 16:08:03 25 4
gpt4 key购买 nike

在我添加 position: fixed; 之前,一切都居中,然后在我添加它之后,它移到了浏览器的左侧,如果非常感谢,任何人都可以帮助我编写代码。

body {
padding: 0;
margin: 0;
overflow-y: scroll;
font-family: "Raleway",sans-serif;
font-size: 1em;
font-weight: bold;
}

#nav {
background-color: #000f1e;
}

#nav_wrapper {
width: 960px;
margin: 0px 0px 0px 115px;
text-align: left;
}

#nav ul {
list-style-type: none;
padding: 0;
margin: 0;
position: relative;
}

#nav ul li {
display: inline-block;
}

#nav ul li:hover {
background-color: #000f1e;

}

#nav ul li a,visited,hover {
color: white;
display: block;
padding: 20px;
text-decoration: none;
}

#nav ul li a:hover {
color: #626262;
text-decoration: none;
}

#nav ul li:hover ul {
display: block;
}

#nav ul ul {
display: none;
position: absolute;
background-color: #01172c;
border-bottom: solid 2px white;
}

#nav ul ul li {
display: block;
}

#nav ul ul li a,visited {
color: #ccc;
}

#nav ul ul li a:hover {
color: #626262;
}

#spon {
background-color: black;

}

#spon_wrapper {
width: 960px;
margin: 0px 0px 0px 115px;
text-align: left;
}

.logo {
text-align: center;
position: fixed;
}

#nav {
z-index: -1;
}

#nav_wrapper {
z-index: -1;
}
<!DOCTYPE html>
<html>
<head>
<title>DeLuzens</title>
<link rel="stylesheet" type="text/css" href="main.css">
</head>
<body>
<div class="logo">
<img src="logo.png" style="height: 125px; width: 100px; text-align: center;">
</div>
<div id="nav">
<div id="nav_wrapper">
<ul>
<li>
<a href="#">Home</a></li>
<li>
<a href="#">Store</a>
<ul>
<li><a href="">Jerseys</a></li>
<li><a href="">Hoodies</a></li>
<li><a href="">Shirts</a></li>
<li><a href="">Headwear</a></li>
<li><a href="">Accessories</a></li>
</ul>
</li>
<li>
<a href="#">Roster</a>
<ul>
<li><a href="">CS:GO</a></li>
<li><a href="">Overwatch</a></li>
<li><a href="">League Of Legends</a></li>
<li><a href="">Dota 2</a></li>
</ul>
</li>
<li>
<a href="#">News</a>
</li>
</ul>
</div>
</div>
</body>
</html>

感谢所有试图帮助我修复代码的人 :D

最佳答案

一种使位置固定元素居中的方法是添加

左:0;右边:0;

所以 css 现在看起来像这样

.logo {
text-align: center;
position: fixed;
left: 0;
right: 0;
}

关于html - 如何使用 HTML CSS 使图像居中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38811749/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com