技术栈

【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
相关推荐
Boilermaker1992
39 分钟前
【Java EE】SpringIoC
前端·数据库·spring
中微子
1 小时前
JavaScript 防抖与节流:从原理到实践的完整指南
前端·javascript
天天向上1024
1 小时前
Vue 配置打包后可编辑的变量
前端·javascript·vue.js
芬兰y
1 小时前
VUE 带有搜索功能的穿梭框(简单demo)
前端·javascript·vue.js
好果不榨汁
1 小时前
qiankun 路由选择不同模式如何书写不同的配置
前端·vue.js
小蜜蜂dry
1 小时前
Fetch 笔记
前端·javascript
拾光拾趣录
1 小时前
列表分页中的快速翻页竞态问题
前端·javascript
小old弟
2 小时前
vue3,你看setup设计详解,也是个人才
前端
Lefan
2 小时前
一文了解什么是Dart
前端·flutter·dart
Patrick_Wilson
2 小时前
青苔漫染待客迟
前端·设计模式·架构
热门推荐
01集群聊天服务器---MySQL数据库的建立02Java学习第十五部分——MyBatis03Coze扣子平台完整体验和实践(附国内和国际版对比)04基于odoo17的设计模式详解---单例模式05使用Ruby接入实时行情API教程06扣子(coze)实战|我用扣子搭建了一个自动分析小红薯笔记内容的AI应用|详细步骤拆解07《深入设计模式》模式结构汇总08基于odoo17的设计模式详解---装饰模式09DeepSeek各版本说明与优缺点分析10KGG转MP3工具|非KGM文件|解密音频