浮动练习(2三折叠)

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
  <style>
.container{
  width: 100%;
  height: 800px;
  /*background-color: aqua;*/
    margin: 0 auto;
}
.d{
    width: 47%;
    height: 459px;
    /*background-color: rosybrown;*/
    border: 2px solid gainsboro;
    border-radius: 10px;
    float: left;
    margin: 23px 37px;
    margin-right: 10px;
    text-align: center;
}
.d img{
    width: 90%;
    margin: 22px 37px;
    margin-bottom: 0px;
}
.d span{
    display: block;
    font-size: 30px;
    padding-top: 20px;
}
.d:hover{
    border: 2px solid red;
}

  </style>
</head>
<body>
<div class="container">
    <div class="d">
        <img src="imgs/a.jpg">
          <span>三折叠</span>
    </div>
    <div class="d">  <img src="imgs/a.jpg">
        <span>三折叠</span> </div>
    <div class="d"> <img src="imgs/a.jpg">
        <span>三折叠</span>  </div>
    <div class="d">  <img src="imgs/a.jpg">
        <span>三折叠</span> </div>
</div>
####图片需要自己下载,改名为a.jpq
</body>
</html>
相关推荐
CodeMi10 分钟前
2026 CSS 接管了这些 JS 的活:6 个 Baseline 特性的落地取舍
javascript·css
lemon_yyds12 分钟前
vue 实现轮播 - 一张半效果
前端
阿明的小蝴蝶16 分钟前
自定义桌面应用、内置系统应用与镜像
前端
代码搬运媛34 分钟前
原生websocket 双工demo
前端
limit007538 分钟前
三维 WebGIS 工具选型:加载、样式、分析、交付,一套界面能做完什么
android·前端·web3·安卓·webgl
全栈项目管理程序猿1 小时前
ArcGIS JS 基础教程(35):体元系列 - VoxelLayer 时间维度动画
前端·javascript
mantou1321 小时前
从纯 CSR 到 SSR:用 WebComponents 做一个 Next.js 式框架 Gemkit
前端·全栈·web components
cidy_981 小时前
深度拆解任务工作台架构:左右分栏、队列管理、实时刷新全方案
前端
Linye1 小时前
告别“PRD 与原型两张皮”!我们把可交互原生组件直接嵌进了需求文档,还能双向回写 Markdown
前端
deli0071 小时前
RSA 为什么公开公钥也解不开?2 个质数拆开实测一遍
前端