zoukankan      html  css  js  c++  java
  • 问题:贴友关于CSS效果的实现

    今日在百度贴吧中,一贴有提出如下问题:

    对于这个问题,咱们贴上代码看效果

       1: <html>
       2: <head>
       3:     <meta http-equiv="content-type" content="text/html;charset=utf-8">
       4:     <style type="text/css">
       5:         #div1
       6:         {
       7:             margin: 0 auto;
       8:             width: 300px;
       9:             border: 1px solid black;
      10:         }
      11:         #div2
      12:         {
      13:             margin-top: 10%;
      14:             margin-left: -30px;
      15:             margin-right: -30px;
      16:             margin-bottom: 10%;
      17:             overflow: hidden;
      18:         }
      19:     </style>
      20: </head>
      21: <body>
      22: <div id="div1">
      23:         <div id="div2">
      24:             <img src="bei.jpg" alt="图片加载失败">
      25:         </div>
      26: </div>
      27: </body>
      28: </html>

    效果:

    简单阐述; 图片放在子div中,而子div没有设置高宽,所以img的大小就撑起了子div的大小,margin值是根据父div及效果图来设置的。如果你有其他思路,欢迎交流

    来源:http://www.ido321.com/457.html

  • 相关阅读:
    剩下的树
    守形数
    小白鼠排队(map容器插入数据的四种方法)
    字母统计
    与7无关的数
    ZOJ
    基于js的CURD插件
    API验证插件
    Django之权限管理插件
    Django之信号和序列化
  • 原文地址:https://www.cnblogs.com/ido321/p/3959122.html
Copyright © 2011-2022 走看看