实现 抽屉效果 css3

css 复制代码
<style>
    #box{
        width:2000px;
        height:328px; 
        overflow: hidden;
    }
    #box >div{
        width: 250px;
        height:328px;
        background-image: url('https://img0.baidu.com/it/u=1032314795,3433105171&fm=253&fmt=auto&app=138&f=JPEG?w=889&h=500');
        float: left;
        cursor: pointer;
        transition: width 1s;
    }
    #box>div:hover{
        width:889px;
    }
</style>
html 复制代码
<div id="box">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
相关推荐
宿6747 分钟前
tsconfig.node.json
前端·javascript·vue.js
小杨互联网8 分钟前
Cursor 前端 Dist 自动化逆向框架:/fr 流水线 · 4 脚本 · Vite/Webpack
前端·webpack·自动化·前端逆向框架·ai前端逆向框架
瑞码空间13 分钟前
Web应用的多端部署之道:浏览器 · Electron · Docker
前端·docker·electron·浏览器·web
徐奥雯XUAOWEN14 分钟前
Codex官网前端可抄吗?从技术视角深度解析与借鉴指南
前端
文艺理科生19 分钟前
3 年,8 种方案,1 次重构:LangChain 记忆方案如何从混乱走向清晰
前端·后端·架构
huabuyu1 小时前
SourceMap:从「看不懂线上报错」到「让 AI 定位真根因」
前端·javascript
এ慕ོ冬℘゜1 小时前
前端树形二级列表渲染 + 页面传参完整实战解析(附原生jQuery源码)
前端·javascript·jquery
weixin_469273811 小时前
.md文件是什么?.md如何打开?
前端·编辑器
不好听6131 小时前
Web Worker:浏览器给 JS 开的后台子线程
前端·浏览器
计算机魔术师2 小时前
数据分析还在靠人跑 SQL?AI 智能体已经把效率拉到 63 倍
前端