技术栈

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
相关推荐
天才熊猫君
3 小时前
配置与数据分离:一种可视化搭建的属性编辑方案
前端·javascript
林希_Rachel_傻希希
3 小时前
web性能之相关路径——AI总结
前端·javascript·面试
竹林818
3 小时前
用 wagmi v2 踩坑两天,我终于搞懂了多链钱包切换在 DeFi 前端中的正确姿势
前端·javascript
用户213661003572
3 小时前
Vue项目搜索功能与面包屑导航
前端·javascript
星栈
4 小时前
LiveView 的实时通信,爽是爽,但 PubSub 和广播也最容易把自己绕晕
前端·前端框架·elixir
用户293075097669
4 小时前
告别关键词匹配,拥抱向量语义 —— RAG 搜索从零到一
前端
独孤留白
4 小时前
从C到Rust:告别 C 的"指针 + 长度"手动模式
前端·rust
掘金安东尼
4 小时前
中小厂前端候选人简历面试拆解:从 HR 面、技术面到主管面的双赢提问法
前端·面试
天平
13 小时前
油猴脚本创建webworker踩坑记录
前端·javascript·typescript
热门推荐
012026 年 AI 编程工具终极横评:Cursor vs Claude Code vs Copilot vs Windsurf02GitHub 镜像站点03【AI】2026 年具身智能模型和世界模型总结04AI科技热点日报 | 2026年07月01日052026 AI 编程工具终极实战指南:Cursor vs Claude Code vs Copilot,开发者该怎么选?062026年6月AI大模型全景报告:GPT-5.6、Claude Opus 4.8、Gemini 3.5,中美AI三足鼎立谁主沉浮?072026 年 AI 大模型 & AI 编程工具实战全总结08Claude Code、Codex、Cursor三分天下:2026年AI编程Agent生态全景剖析092026年6月AI行业全景:从百模大战到Agent元年,这30天发生了什么?10Trae国际版与国内版深度测评:AI原生IDE的双生花