html - 如何使 2 张图像同时响应
问题描述
我有一个 html 和 css 代码来显示 2 个图像。我正在使用引导程序使它们响应,但只有背景是响应的。有人可以告诉我为什么以及如何解决它吗?
html代码:
<img id="introducaoBackground" class="img-fluid" src="Imagens/introducaoBackground.png" alt="Background da introdução"></img>
<img id="logo" class="img-fluid" src="Imagens/logo.png" alt="Logo"></img>
#introducaoBackground {
position: absolute;
top: 0px;
left: 0px;
}
#logo {
position: absolute;
top: 73px;
left: 280px;
}
解决方案
那不是相对容器内的绝对徽标吗?
<img id="introducaoBackground" class="img-fluid" src="Imagens/introducaoBackground.png" alt="Background da introdução"></img>
<div id="relativeDiv">
<img id="logo" class="img-fluid" src="Imagens/logo.png alt="Logo"></img>
</div>
我已经为 relativeDiv id 重新使用了背景属性,但当然您可以在相对位置旁边创建不同的属性。
#introducaoBackground {
position: relative;
top: 0px;
left: 0px;
}
#logo {
position: absolute;
top: 73px;
left: 280px;
}
.img-fluid {
max-width: 100%;
height: auto;
}
#relativeDiv {
position: relative;
top: 0px;
left: 0px;
}
推荐阅读
- php - 查询:从参数计算为 NULL 次的表中计算 id
- java - 使用 JNDI 进行 Spring Java 配置
- c# - asp.core 页面剃刀枚举下拉列表
- javascript - 如何将 jQuery 模板集成到 React App 中
- .net - 替代/如何在 CosmosDb 中 CreateStoredProcedureIfNotExists?
- java - 通过 JAX-rs 发送时,额外变量被添加到 json 中
- angular - 带有GET参数的Angular 7路由器路径
- codeigniter - Code Igniter - Controller/Model slug 不返回任何结果
- python - Python:我尝试使用 tabula:ModuleNotFoundError: No module named 'tabula'
- node.js - 无法在量角器的电子邮件内容中提供换行符