html - 图像响应

标签 html css

我哪里出错了?

这是我的代码

<div id="logo" style="position: absolute; right: 50px; top:0px;">
  <img src="./images/logo1.png" width="400" height="400" border="0" alt="Logo" />
</div>

我想让图像出现在屏幕的右侧。为了使其具有响应性,我将宽度和高度更改为 23%(原始图像为 3000 x 3000 像素)。 它可以很好地适应图像的大小,而是显示在上面定义的位置,它出现在屏幕的左侧。仅当我将宽度更改为百分比时...为什么?

最佳答案

你需要使用一些CSS

        <div id="logo">
        <img src="./images/logo1.png" alt="Logo" />
    </div>
<style>
#logo {width:400px; position: absolute; right: 50px; top:0px;}
#logo img {width:100%;}
</style>

关于html - 图像响应,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48340872/

相关文章:

javascript - VueJS - v-if 和 v-show 无法正常工作

HTML,CSS如何使元素的宽度始终到页面底部?

javascript - onclick 事件更新表值一次,但从不在第二次 onclick 事件更新时显示更新值

html - 如何将下拉菜单对齐到 mat-card-title 元素的右侧?

javascript - 将类添加到动态更改对象列表中的顶部对象

html - 使用 html 和 css 的下拉菜单显示下拉项

javascript - 在本地存储中存储 CSS 和 JS

jquery - 我想发布数据并在浏览器上显示服务器发送的http响应,但我卡在浏览器上没有任何显示

html - 使用 CSS flexbox/webkit 创建样式