html - HTML中的图像不显示
问题描述
我遇到了一个奇怪的问题。我有两次类似的代码来显示图像,但其中一次显示图像,另一次不显示。
这是我的代码:
<div id="blocMethodo">
<div id="divTitreMethodo">
<p class="texteTitreListeComportements">
Notre méthodologie
</p>
</div>
<div class="divVideoUn">
<div class="carteVideoUn">
<video autoplay="true" muted loop="true" poster="/Images/Methodologie900.jpg" id="videoDeux">
<source src="../Videos/videoprocesssfondgris.mp4">
</video>
</div>
</div>
<div class="divImagePricing">
<img src="../Images/Methodologie900.jpg" alt="Methodologie" id="imageMethodo"/>
</div>
</div>
<div id="blocPricing">
<div id="divTitrePricing">
<p class="texteTitreListeComportements">
Pricing
</p>
</div>
<div id="divTextePricing"
<p class="premiertexte">
Notre tarif s'établit en fonction du nombre de personnes travaillant pour votre organisation.
</p>
</div>
<div class="divImagePricing">
<img src="../Images/Pricingsanstitre900.jpg" alt="Pricing" id="imagePricing"/>
</div>
</div>
和下面的 CSS
#blocMethodo
{
width: 350px;
height: 290px;
margin-top: 20px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding-left: 5px;
padding-right: 5px;
background-color: #261939;
border-radius: 10px;
}
#divTitreMethodo
{
width: 340px;
height: 40px;
margin-bottom: 20px;
display: flex;
align-items:flex-start;
justify-content: center;
}
#imageMethodo
{
max-width: 100%;
}
#blocPricing
{
width: 350px;
height: 340px;
margin-top: 20px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding-left: 5px;
padding-right: 5px;
background-color: #261939;
border-radius: 10px;
}
#divTitrePricing
{
width: 340px;
height: 40px;
margin-bottom: 20px;
display: flex;
align-items:center;
justify-content: space-around;
}
#divTextePricing
{
width: 340px;
height: 50px;
display: flex;
align-items:flex-start;
justify-content: flex-start;
}
.divImagePricing
{
width: 340px;
height: 200px;
background-color: yellow;
}
#imagePricing
{
max-width: 100%;
}
与所有
'video' Div (divVideoUn, carteVideoUn, videoDeux) 设置为显示:无;
因为我在我的 CSS 的“智能手机”部分。
我的问题是,在第一个块中,图像 Methodologie900.jpg 没有显示,我只看到黄色矩形(divImagePricing 类的背景)。第二张图片显示完美,尽管我认为它是相同的代码。当然,我检查了我的图像的存在、扩展名和拼写,我什至复制/粘贴了链接 Pricingsanstitre900.jpg 来代替第一张图像的链接,但这并没有帮助。
解决方案
在“#blocmethodo”上替换这一行:
height: 290px;
有了这个
min-height: 456px;
推荐阅读
- ruby - if else 语句的复杂性,编码挑战:Ruby
- dask - 将数据帧从 jupyter 加载到 NERSC 集群上的 dask-mpi
- nest-api - 可以使用新的设备访问控制台设置恒温器的湿度水平吗?
- html - 将悬停文本添加到 a 标签需要更改颜色的按钮
- python - I am splitting CSV columns into separate lists- why am I getting 'AttributeError: 'list' object has no attribute 'split''?
- c++ - 如何在双精度值中找到第一个 1 的位置?
- flutter - How can resolve conflicts Dart SDK binary
- html - How can a novice integrate reCAPTCHA v2 into a website built with a CMS?
- xaml - SwipeView BottomItems breaking TapGestureRecognizer?
- r - 比较r中两列中的字符串