浮动练习(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>
相关推荐
码上暴富4 分钟前
Echarts雷达图根据数值确定颜色
前端·javascript·echarts
Mintopia17 分钟前
在混沌宇宙中捕捉错误的光——Next.js 全栈 Sentry / LogRocket
前端·javascript·next.js
Mintopia19 分钟前
长文本 AIGC:Web 端大篇幅内容生成的技术优化策略
前端·javascript·aigc
VueVirtuoso20 分钟前
SaaS 建站从 0 到 1 教程:Vue 动态域名 + 后端子域名管理 + Nginx 配置
前端·vue.js·nginx
少年阿闯~~26 分钟前
transition(过渡)和animation(动画)——CSS
前端·css·动画·过渡
Async Cipher28 分钟前
CSS 继承 (Inheritance)
前端·css
祈祷苍天赐我java之术36 分钟前
Vue 整体框架全面解析
前端·javascript·vue.js
洛小豆1 小时前
Git 打标签完全指南:从本地创建到远端推送
前端·git·github
世间小小鱼1 小时前
【爬坑指南】亚马逊文件中心 AWS S3 预签名URL 前端直传
前端·云计算·aws
华仔啊2 小时前
前端登录token到底应该存在哪?LocalStorage、SessionStorage还是Cookie?一篇说透!
前端·javascript