技术栈

实现 抽屉效果 css3

路光.2023-12-03 18:50
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>
上一篇:Screenshot To Code
下一篇:java的内部类
相关推荐
无尽的沉默
1 分钟前
Thymeleaf 表达式
java·开发语言·前端
无尽的沉默
3 分钟前
Spring Boot 整合 Thymeleaf 模板引擎
java·前端·spring boot
We་ct
9 分钟前
从输入URL到页面显示的完整技术流程
前端·edge·edge浏览器
先做个垃圾出来………
26 分钟前
DeepDiff差异语义化特性
服务器·前端
蓝帆傲亦
1 小时前
前端常用可视化图表组件大全
前端
CappuccinoRose
2 小时前
HTML语法学习文档(九)
前端·学习·架构·html5
NEXT06
2 小时前
BFC布局
前端·css·面试
菜鸟小芯
2 小时前
【GLM-5 陪练式前端新手入门】第四篇:卡片布局 —— 让个人主页内容更有层次
前端·人工智能
Hello.Reader
2 小时前
Leptos + Tauri 2 前端配置Trunk + SSG + 移动端热重载一次打通(Leptos 0.6 口径)
前端
岱宗夫up
2 小时前
【前端基础】HTML + CSS + JavaScript 进阶(一)
开发语言·前端·javascript·css·html
热门推荐
01GitHub 镜像站点02AI Agent 平台横评:ZeroClaw vs OpenClaw vs Nanobot03Claude Code + GLM4.7 避坑指南:解决 Unable to connect to Anthropic services04HTML 早已不是标签了,它现在是系统级接口:这 9 个 API 直接干翻常用 JS 库05如何解决 OpenClaw “Pairing required” 报错:两种官方解决方案详解06【OpenClaw 本地实战 Ep.3】突破瓶颈:强制修改 openclaw.json 解锁 32k 上下文记忆07全面体验 Grok API 中转站(2025 · Grok 4 系列最新版)08MIUI显示/隐藏5G开关的方法,信号弱时开启手机Wifi通话方法09openClaw安装飞书插件|核心踩坑:spawn EINVAL 错误终极解决指南10配置 OpenClaw 使用 Ollama 本地模型