技术栈

【css-banner图片自适应】

聚宝盆_2023-10-07 16:16
html 复制代码
<picture>
            <source media="(max-width: 480px)" srcset="图片地址">
            <source media="(min-width: 481px)" srcset="图片地址">
            <img src="图片地址" id="homebanner">
        </picture>
css 复制代码
img{
    height: 290px;
    width: 100%;
}
// 小于992px
@media (max-width: 992px) { 
    img{
        width: 100%;
        height: 180px;
    }
}
上一篇:Vue Router学习(四)—— 嵌套路由
下一篇:android native C++编程实现数据库加密sqlcipher
相关推荐
非优秀程序员
4 小时前
第10章 千团出世|《互联网产品恩仇录》
前端
非优秀程序员
4 小时前
第11章 小高在对面|《互联网产品恩仇录》
前端
非优秀程序员
4 小时前
第14章 只剩美团|《互联网产品恩仇录》
前端
非优秀程序员
4 小时前
第09章 老乡何必为难老乡|《互联网产品恩仇录》
前端
非优秀程序员
4 小时前
第07章 孙德良的阳谋|《互联网产品恩仇录》
javascript·后端
非优秀程序员
4 小时前
第03章 三大门户,烽烟起于瀛海威|《互联网产品恩仇录》
前端
程序员大阳
8 小时前
HTML+CSS+JS对话式实战(5)-活动管理页之查看报名名单的实现
javascript·css·html·查看报名名单
曦樂~
8 小时前
【Web Development】02 CSS
前端·css
风骏时光牛马
9 小时前
后端服务接口开发与数据逻辑处理
前端
东鹏特饮
9 小时前
经典打砖块(Breakout)游戏
前端·css·css3
热门推荐
01国内可直接用、免费额度/永久免费的大模型API清单(含 SiliconFlow、火山、阿里、智谱、百度、Kimi、DeepSeek、DMXAPI 等)02历年考研数学一、数学二、数学三真题试卷及答案PDF03如何新建文件夹? 电脑新建文件夹的4种方法04几个好用的ip纯净度检测网站05GitHub 镜像站点06微信历史版本含下载地址( Windows PC | 安卓 | MAC )及设置微信不更新07昇腾910B系列芯片完全指南:四款型号对比、服务器选型与大模型部署实战08苹果iPA游戏软件资源下载网站09蜘蛛磁力 搜索引擎大全,如何使用蜘蛛磁力查找磁力链接10Dify:一站式AI应用开发平台全解析与Windows部署指南