当前第2页 返回上一页
图片在一个盒子内
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | <style type= "text/css" >
#box {
width: auto;
height: auto;
max-width: 600px;
max-height: 500px;
border: 5px solid yellow;
}
img {
width: auto;
height: auto;
max-width: 100%;
}
</style>
<body>
<div id= "box" >
<img src= "https://i.loli.net/2018/06/17/5b2639a6e6c61.jpeg" alt= "timg.jpeg" title= "timg.jpeg" />
下面的文字
</div>
</body>
|

ps:
1 、利用width height auto 来缩放
2、利用max-width max-height 来设置最大宽高,为100%表示可原始最大。
以上就是css怎么让图片随屏幕变化大小的详细内容,更多文章请关注木庄网络博客!
返回前面的内容
相关阅读 >>
css中的内联元素是什么
css阴影边框怎么设置
css可以做什么
css font-weight属性怎么用
css设置外边距的属性名是什么
什么是css
css如何指定样式表使用的字符编码
css怎么让div不换行
css3和css的区别是什么
css如何显示文字的上标和下标
更多相关阅读请进入《css》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » css怎么让图片随屏幕变化大小