图片居中自适应浏览器缩放

最新推荐文章于 2023-05-05 14:36:41 发布

墨墨博客

最新推荐文章于 2023-05-05 14:36:41 发布

阅读量1.9k

点赞数

分类专栏： css3 html5 文章标签： css html

本文链接：https://blog.csdn.net/wangweiscsdn/article/details/53738599

版权

css3 同时被 2 个专栏收录

40 篇文章 0 订阅

订阅专栏

html5

30 篇文章 1 订阅

订阅专栏

代码如下，div里面放图片就好了

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <title>图片适应</title>
  <style>
  body{
    min-width: 1000px;//设置最小宽度，这样图片才不会乱掉
  }
    .div{
      width: 1000px;
      height: 200px;
      margin: 0 auto;
    }
    .divimg{		//如果放了图片就不用设置高度、宽度、边框
      width: 200px;
      height: 200px;
      border: 1px solid black;
      float: left;
    }
  </style>
</head>
<body>
  <div class="div">
    <div class="divimg"> </div>
     <div class="divimg"> </div>
     <div class="divimg"> </div>
     <div class="divimg"> </div>
    
  </div>
</body>

结果如下图：

墨墨博客

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
图片居中自适应浏览器缩放

代码如下，div里面放图片就好了图片适应 body{ min-width: 1000px;//设置最小宽度，这样图片才不会乱掉 } .div{ width: 1000px; height: 200px; margin: 0 auto; } .divimg{ //如果放了图片就不用设置高度、宽度、边
复制链接

扫一扫

专栏目录