gpt4 book ai didi

css - Safari 图片宽度变化

转载 作者:太空宇宙 更新时间:2023-11-04 02:03:57 25 4
gpt4 key购买 nike

我目前将我的网站放在网上,但我对 safari 中的图像大小有疑问,在我的 CSS 中,我将宽度设置为:

img {
width: 450%;
}

这是网站:

http://antoninmarchard.com/

我不明白为什么图像在 chrome 和 mozilla 中显示良好,但在 Safari 中却不显示..

最佳答案

你的代码不好,而且它现在在 IE 中看起来不错。我已经清理了 html 和 css 代码,您可以应用这些更改来解决您的问题:

HTML 更改 让特定部分的 html 变得简单:

<div class="inner-banner">
<div class="left">
<h1> Donnez vie à vos idées, créons ensemble. </h1>
<button class="btn btn-custom-am" data-toggle="modal" data-target="#contact_modal"> Contactez-moi </button>
</div>
<div class="right">
<img src="src/img/banner-design.svg" alt="cube with smoke, smartphone and computer">
</div>
</div>

CSS Changes 需要修复代码

.banner .inner-banner{
width: 100%;
max-width: 100%;
position: relative;
min-height: 100vh;
}

.banner .inner-banner .left{
width: 40%;
float: left;
position: absolute;
top: 50%;
left: 4%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
color: #ffffff;
}

.banner .inner-banner .right{
width: 70%;
float: right;
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
}

从图像中移除width:450%,我们不需要它

关于css - Safari 图片宽度变化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41210714/

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