技术栈

css实现div被图片撑开

小白白一枚1112024-11-07 21:54

固定好盒子的宽度,高度随传过来的图片大小决定

html 复制代码
<div class="tab-con"> 
    <img
       :src="concertInfo.detail"
       alt=""
     >
</div>
css 复制代码
.tab-con {
        margin-bottom: 20px;
        width: 700px;

        img {
          width: 700px;
          height: auto;
          object-fit: contain;
        }
      }
上一篇:山洪灾害监测预警系统综合解决方案
下一篇:拷贝 cp -rdp 和 cp -a
相关推荐
奥莱维
6 小时前
【无标题】
java·前端·javascript
用户92108026286
6 小时前
0. 为什么我们的项目选择 Cesium:从三维地图、离线部署到工程代价
前端
阿懂在掘金
6 小时前
同一份弹窗我重构了三次:从 v-model 地狱到路由式调用,终于治好了模板臃肿
前端·vue.js·前端框架
悟空瞎说
6 小时前
从 CRA 到 Vite:含 Cesium 的真实项目迁移实战记录
前端
悟空瞎说
6 小时前
Vite 中零配置接入 Cesium.js:vite-plugin-cesium-engine 深度解析
前端
To_OC
7 小时前
后端接口还没交付,前端如何独立把整套业务跑通
前端·react.js·全栈
王琦0318
7 小时前
WEB服务
前端
霹雳桃
7 小时前
Vue3 + Vite 构建版本注入实战:一份 version.json 终结「线上到底是哪一版」
前端
黄金决明子
7 小时前
浏览器Window底层操作全解
前端·javascript
热门推荐
01GitHub 镜像站点02国内可直接用、免费额度/永久免费的大模型API清单(含 SiliconFlow、火山、阿里、智谱、百度、Kimi、DeepSeek、DMXAPI 等)03VSCode+CodeX扩展,无法启动04微信历史版本含下载地址( Windows PC | 安卓 | MAC )及设置微信不更新052026 国产 AI 大模型横评:DeepSeek、通义千问、Kimi、文心一言、星火、豆包谁更能打?06AI 编程 IDE 全景解析 2026:Agent 全面接管开发链路07Agnes AI 免费 API 接入指南:文本、生图、生视频,一套接口全免费08历年考研数学一、数学二、数学三真题试卷及答案PDF09如何新建文件夹? 电脑新建文件夹的4种方法102026年7月AI圈大地震:GPT-5.6被政府限制、Claude入驻Slack、Anthropic自研芯片