gpt4 book ai didi

html - Firefox + IE,不高度图片 Html,CSS,在 Chrome 上工作

转载 作者:行者123 更新时间:2023-11-28 04:55:07 26 4
gpt4 key购买 nike

很抱歉做错了什么。我想将我的 Logo 放在我的网站上,并将网站标题作为图片放在它旁边。但是我的“headerlogo.png”不会在 Firefox 和 IE 中使用“高度”重新调整,只能在 Chrome 中工作......不知道为什么......想放置一些屏幕截图但没有成功...

因此该网站已经在线。可以去看看Click HERE .所以这是我的 home.html 的代码我正在研究这个并测试并将最终代码复制到其他页面,所以不要关心它们......仅关于 home.html

这是 home.html 和我的 style.css 的代码:

body {
background-color: #222;
}

header {
background-color: #000;
color: #FFF;
font-weight: bolder;
}

table {
border-style: none;
}

.headerlogo {
height: 7%;
margin-left: 2%;
margin-bottom: 2%;
margin-top: 2%;
}

.headerpic {
padding-left: 9%;
margin-bottom: 2%;
margin-top: 2%;
width: auto;
height: 100%;
}

.navpic {
width: 17%;
float: left;
background-color: #000;
margin-right: 3%;
margin-bottom: 0.2%;
box-shadow: 5px 0px 10px black;
}

.nav {
list-style-type: none;
background-color: #000;
margin-top: -1%;
}

.navpic:hover {
background-color: #111;
}

hr.bottom {
margin-bottom: 2%;
}

div.articletd {
background-color: #111;
color: #FFF;
width: 640px;
height: 400px;
font-family: sans-serif;
float: left;
margin-top: -3px;
padding-left: 2%;
padding-right: 2%;
margin-left: 2%;
}

td.normalarticle {
background-color: #111;
color: #FFF;
font-family: sans-serif;
text-align: left;
vertical-align: top;
padding-left: 2%;
padding-right: 2%;
line-height: 1.6;
height: auto;
width: 49.5%;
}

table.normalarticleeinseitig {
background-color: #111;
color: #FFF;
font-family: sans-serif;
text-align: left;
vertical-align: top;
padding-left: 2%;
padding-right: 2%;
line-height: 1.6;
height: auto;
width: 100%;
;
border: 0 solid #222;
;
}

table.normalarticle {
width: 100%;
line-height: 1.6;
border: 0 solid #222;
;
}

.middlearticle {
width: 1%;
background-color: #222;
}

.kontaktformularrechts {
margin-left: 20%;
}

.buttonformular {
background-color: #111;
color: #FFF;
border-width: medium;
}

h1 {
font-size: 2em;
margin-top: 2%;
text-align: left;
}

p.ptd {
line-height: 1.6;
text-align: left;
padding-left: 2%;
}

.spotifylink {
width: 4%;
height: 4%;
}

a.spotifylink:hover {
background-color: #FFF;
}

.footer {
background-color: #000;
margin-top: 1%;
color: #FFF;
}

.footerp {
margin-left: 5%;
font-family: sans-serif;
}

.footertd {
width: 100%;
}

footer td {
width: 7.5%;
text-align: center;
}

footer img {
margin-top: -20%
}

.recht {
margin-top: 1%;
background-color: #111;
color: #FFF;
font-family: sans-serif;
}

.impressumtable {
width: 37.5%;
margin-left: 3.5%;
}

.impressumtd {
text-align: left;
}

a {
text-decoration: none;
}

a:link {
color: #FFF;
}

a:visited {
color: #FFF;
}

a:active {
color: #FFF;
}

a:hover {
color: #AAA;
}
<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="shortcut icon" type="image/x-icon" href="bilder/favicon.png">
<title>DJ Dre Loo</title>

</head>

<body>
<header>
<table>
<tr>
<td >
<img class="headerlogo" src="bilder/headerlogo.png">
</td>
<td class="headerpic">
<img src="bilder/headertitle.png">
</td>
</tr>
</table>

</header>
<hr>
<nav>
<div>
<ul class="nav">
<li class="navfirst">
<a href="home.html"><img class="navpic" src="bilder/home.png"></a>
</li>
<li>
<a href="biografie.html"><img class="navpic" src="bilder/biografie.png"></a>
</li>
<li>
<a href="djing.html"><img class="navpic" src="bilder/djing.png"></a>
</li>
<li>
<a href="kontakt.html"><img class="navpic" src="bilder/kontakt.png"></a>
</li>
<li>
<a href="td.html"><img class="navpic" src="bilder/td.png"></a>
</li>
</ul>
</div>
<hr class="bottom">
</nav>

<article>
<table class="normalarticleeinseitig">
<tr>
<td>
<div style="height:10px;font-size:10px;"></div>
<div align="center">
<img width="100%" src="bilder/eingebunden/Homepic.png">
</div>
</td>
</tr>
</table>
</article>
<hr height="0px" color="#222">
<footer>
<div class="footer">
<table class="footertd">
<tr>
<td>
<p class="footerp">
<a href="https://www.facebook.com/djdreloo/">Facebook</a>
</p>
</td>
<td>
<p class="footerp">
<a href="mailto:your.dj.dreloo@gmail.com">Email</a>
</p>
</td>
<td>
<p class="footerp">
<a href="https://www.instagram.com/dreloo/">Instagram</a>
</p>
</td>
<td>
<p class="footerp">
<a href="https://twitter.com/djdreloo">Twitter</a>
</p>
</td>
<td>
<p class="footerp">
<a href="https://open.spotify.com/user/andreschuele">Spotify</a>
</p>
</td>
<td>
<p class="footerp">
<a href="http://www.mixcrate.com/djdreloo">Mixcrate</a>
</p>
</td>
<td>
<p class="footerp">
<a href="https://www.mixcloud.com/DJ_DRE_LOO/">Mixcloud</a>
</p>
</td>
<td>
<p class="footerp">
<a href="https://www.facebook.com/djdreloo/">Mixify</a>
</p>
</td>
</tr>
<tr>
<td>
<p class="footerp">
<a href="https://www.facebook.com/djdreloo/"><img width="25%" src="bilder/facebooklogo.png"></a>
</p>
</td>

<td>
<p class="footerp">
<a href="mailto:your.dj.dreloo@gmail.com"><img width="30%" class="linklogos" src="bilder/maillogo.png"></a>
</p>
</td>
<td>
<p class="footerp">
<a href="https://www.instagram.com/dreloo/"><img width="25%" class="linklogos" src="bilder/instagramlogo.png"></a>
</p>
</td>
<td>
<p class="footerp">
<a href="https://twitter.com/djdreloo"><img width="25%" class="linklogos" src="bilder/twitterlogo.png"></a>
</p>
</td>
<td>
<p class="footerp">
<a href="https://open.spotify.com/user/andreschuele"><img width="25%" class="linklogos" src="bilder/spotifylogo.png"></a>
</p>
</td>
<td>
<p class="footerp">
<a href="http://www.mixcrate.com/djdreloo"><img width="25%" class="linklogos" src="bilder/mixcratelogo.png"></a>
</p>
</td>
<td>
<p class="footerp">
<a href="https://www.mixcloud.com/DJ_DRE_LOO/"><img width="30%" class="linklogos" src="bilder/mixcloudlogo.png"></a>
</p>
</td>
<td>
<p class="footerp">
<a href="https://open.spotify.com/user/andreschuele"><img width="45%" class="linklogos" src="bilder/mixifylogo.jpg"></a>
</p>
</td>
</tr>

</table>
</div>
<div class="recht">
<table class="impressumtable">
<tr>
<td class="impressumtd">
<a href="Impressum.html">Impressum</a>
</td>
<td class="impressumtd">
<a href="Disclaimer.html">Disclaimer</a>
</td>
<td class="impressumtd">
<a href="selber.html">(*)Warum...</a>
</td>

</tr>
</table>
</div>
</footer>

</body>

</html>

也许你可以帮助我:)

最佳答案

问题出在表格元素上,当我在我的 firefox 浏览器上查看它时,该网站并不像我在 chrome 上查看的那样可见。

最好删除表格并使用 html float 属性

http://www.w3schools.com/cssref/pr_class_float.asp

关于html - Firefox + IE,不高度图片 Html,CSS,在 Chrome 上工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40453884/

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