HTML – Img落在后台,但它不应该

HTML – Img落在后台,但它不应该,第1张

概述我正在尝试制作一个页面,只是为了锻炼,我遇到了一个问题,所以如果你运行代码,徽标应该在中心顶部,而不是在它下面的菜单..但它落在后台, 请帮忙 1.如何在每三个菜单列表项下添加一个下拉列表,我可以在其中添加一些文本,图像和位置 body { background-color:lightgray; font-family: Tahoma, Cambria;}#header { height 我正在尝试制作一个页面,只是为了锻炼,我遇到了一个问题,所以如果你运行代码,徽标应该在中心顶部,而不是在它下面的菜单..但它落在后台,请帮忙
1.如何在每三个菜单列表项下添加一个下拉列表,我可以在其中添加一些文本,图像和位置

body {	background-color:lightgray;	Font-family: Tahoma,Cambria;}#header {	height: 300px;}#logo {	position: absolute;    margin: auto;    left: 0;     right: 0;    top: 0; }#menu {	position: relative;	max-height:60px;	Font-family: Cambria;	Font-style: bold,italic;	text-align: center;}#menu ul {	List-style-type: none;	margin: 0;    padding: 0;    float:none;}#menu li a {	display:inline-block;	color:#009CFF;	padding: 10px 200px;	overflow:hidden;	Transition: 0.3s;	Font-style:italic;	Font-weight: bold;	text-decoration:none;	margin: 0 0 0 0;}#menu li a:hover {    background-color: dimgray;    color: deepskyblue;}body {	border: 2px solID dark-gray ;}l>
<!DOCTYPE HTML ><HTML>	<head>		<Title></Title>    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />	</head>	<body>		<header>			<img src = "http://via.placeholder.com/350x150" ID = "logo" alt = "Antomatik logo"/> 		</header>		<div ID = "menu">				<ul>					<li >						<a href="antomatik/onama.HTML">O nama</a></li>					<li >						<a href="antomatik/povijest.HTML">Povijest</a></li>					<li >						<a href="antomatik/kontakt.HTML">Kontakt</a></li>								</ul>		</div>		<footer>				</footer>	</body></HTML>
解决方法 它的标题,而不是#header

body {	background-color:lightgray;	Font-family: Tahoma,Cambria;}header {	height: 100px;}#logo {	position: absolute;    margin: auto;    left: 0;     right: 0;    top: 0; }#menu {	position: relative;	max-height:60px;	Font-family: Cambria;	Font-style: bold,italic;	text-align: center;}#menu ul {	List-style-type: none;	margin: 0;    padding: 0;    float:none;}#menu li a {	display:inline-block;	color:#009CFF;	padding: 10px 200px;	overflow:hidden;	Transition: 0.3s;	Font-style:italic;	Font-weight: bold;	text-decoration:none;	margin: 0 0 0 0;}#menu li a:hover {    background-color: dimgray;    color: deepskyblue;}body {	border: 2px solID dark-gray ;}l>
<!DOCTYPE HTML ><HTML>	<head>		<Title></Title>    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />	</head>	<body>		<header>			<img src="http://via.placeholder.com/300x100" ID = "logo" alt = "Antomatik logo"/> 		</header>		<div ID = "menu">				<ul>					<li >						<a href="antomatik/onama.HTML">O nama</a></li>					<li >						<a href="antomatik/povijest.HTML">Povijest</a></li>					<li >						<a href="antomatik/kontakt.HTML">Kontakt</a></li>								</ul>		</div>		<footer>				</footer>	</body></HTML>
总结

以上是内存溢出为你收集整理的HTML – Img落在后台,但它不应该全部内容,希望文章能够帮你解决HTML – Img落在后台,但它不应该所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/1058127.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2022-05-25
下一篇2022-05-25

发表评论

登录后才能评论

评论列表(0条)

    保存