zoukankan      html  css  js  c++  java
  • 背景图片自适应

    <body style="background-color:#d43167">
    <div style="position: absolute;z-index: -1; top:0px; left:0px; 100%; " ><img src="img/bg.png " width="100%" height="100%"/></div>

    <div style="position: absolute;z-index: 1; 80%;margin-top: 10%; left:10%"><img src="img/logo2.png" width="100%" height="100%" /></div>
    </body>

    之前看见在div里面用了height:100%的,但是要注意的是:如果父级没有设置高度这个属性是用不上的,这时候如果你div里面又没有放东西,是没有显示效果的,只会显示背景色




    所以要解决这个问题(不用js方法的话),一是:可以事先设置好父级的高度,二是:在里面放足够的元素;撑起div的高,再用合适的margin;padding;元素的height撑到自己想要的高度,如果不想用px设置,可以用百度比设置如:margin-top:10%;

    在用百分比让元素居中的方法:position:absolute:top:50%;margin-top:-(元素高度)/2;left:50%;margin-left:-(元素宽度)/2;
    慢但努力着
  • 相关阅读:
    利用docker搭建rtmp服务器(1)
    ES6转换为ES5
    一些乱七八糟的东西
    xss攻击和sq注入
    python asyncio笔记
    图解密码技术一些笔记
    做网页前端遇到的一些问题
    错误处理的一些想法
    吐槽下国内的云笔记
    python的编码问题
  • 原文地址:https://www.cnblogs.com/wangrongxiang/p/5177717.html
Copyright © 2011-2022 走看看