gpt4 book ai didi

html - 无法获取页面左侧的图像

转载 作者:太空宇宙 更新时间:2023-11-04 11:15:37 26 4
gpt4 key购买 nike

我想要页面左侧的红色图像,但我认为有某种边距,因为我无法将它放到 Angular 落里。空白行与我的菜单栏中的图像一起使用,但这是在另一个 div 中。有谁知道我怎样才能把图片放在页面的右边?

this is how it looks like

@charset "UTF-8";

/* algemene opmaak en instellingen body --------------------------------------------------------------------- */
body {
background-image: url("achtergronden/hout.png");
width: 100%;
}

html, body{
margin: 0;
padding: 0;
}

/* logo ----------------------------------------------------------------------------------------------------- */
#Anouk {
text-align: center;
margin: 0 auto;
padding: 0;
}

#Anouk img{
display: block;
}

/* menubalk ------------------------------------------------------------------------------------------------- */
#header {
height: 80px;
background: #000000;
}

li {
display: block;
float: left;
}

li a {
color: #FFFFFF;
height: 80px;
}

#contact {
float: right;
}

/* blauwe stuk pagina homepage en portfolio ----------------------------------------------------------------- */
#homepagina {
background-image: url("achtergronden/blauw.png");
width: 100%;
height: 485px;
}

/* updates -------------------------------------------------------------------------------------------------- */
#updates {
height:1000px;
}

#laatste {
color: #FFFFFF;
font-family: oswald, sans-serif;
font-size: 30px;
text-align: center;
text-decoration: bold 700;
}

/* footer --------------------------------------------------------------------------------------------------- */
#footer {
height: 85px;
width: 100%;
background: #000000;
color: #FFFFFF;
text-align: right;
}

#facebook img {
margin-top: 7px;
padding: 0;
}

#email img {
margin: 0;
padding: 0;
}

/* ---------------------------------------------------------------------------------------------------------- */
<body>

<div id="Anouk"><img src="logo/Hout2.png" width="100%" alt="Logo"/></div>

<div id="header">
<div id="menu">
<!--Home-->
<li id="home">
<a href="index.html">
<img src="Iconen/menu/home.png" height="80px" alt="home"
onmouseover="this.src='iconen/menu/home2.png'"
onmouseout="this.src='iconen/menu/home.png'"/>
</a>
</li>
<!--Over Mij-->
<li id="over">
<a href="over.html">
<img src="iconen/menu/over.png" height="80px" alt="over mij"
onmouseover="this.src='iconen/menu/over2.png'"
onmouseout="this.src='iconen/menu/over.png'"/>
</a>
</li>
<!--Portfolio-->
<li id="portfolio">
<a href="portfolio.html">
<img src="iconen/menu/portfolio.png" height="80px" alt="portfolio"
onmouseover="this.src='iconen/menu/portfolio2.png'"
onmouseout="this.src='iconen/menu/portfolio.png'"/>
</a>
</li>
<!--Contact-->
<li id="contact">
<a href="contact.html">
<img src="iconen/menu/contact.png" height="80px" alt="contact"
onmouseover="this.src='iconen/menu/contact2.png'"
onmouseout="this.src='iconen/menu/contact.png'"/>
</a>
</li>
</div>
</div>

<div id="homepagina">
<a href="#">
<img src="iconen/portfolio/html.png" height="25px" alt="home"
onmouseover="this.src='iconen/portfolio/html2.png'"
onmouseout="this.src='iconen/portfolio/html.png'">
</a>
</div>

<div id="updates">
<p id="laatste">Laatste Updates</p>
</div>

<div id="footer">
<p id="facebook">
<a href="https://www.facebook.com/..." target="_blank">
<img src="iconen/footer/facebook.png" height="25px" alt="home"
onmouseover="this.src='iconen/footer/facebook2.png'"
onmouseout="this.src='iconen/footer/facebook.png'">
</a>
</p>
<p id="email">
<a href="mailto:....">
<img src="iconen/footer/email.png" height="25px" alt="home"
onmouseover="this.src='iconen/footer/email2.png'"
onmouseout="this.src='iconen/footer/email.png'">
</a>
</p>
</div>
</body>

最佳答案

float 后你应该清除:

1.首先将“clearfix”类添加到<div id="menu"> - <div id="menu" class="clearfix">

2.之后添加你的风格:

.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }

您有另一种清除方法 - 将高度添加到 <div id="menu">或添加 width:100%; overflow:hidden; .但是使用 clearfix 的第一种方法是最好的。

关于html - 无法获取页面左侧的图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33255665/

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