css自适应

一、顶部标题自适应

<html>
    <head>
        <title>顶部标题</title>
        <style>
            body{padding:0;margin:0;}
        </style>
    </head>

    <div style="width:100%;height:50px;line-height:50px;background-color:rgba(35,33,31,.2);">
        <div style="width:50px;height:50px;line-height:50px;background-color:#f00;position:absolute;top:0;left:0;text-align:center;color:#fff;">返回</div>
        <div style="padding:0 60px;"><input type="text" style="width:100%;height:50px;border:1px solid black;padding:0 10px;" placeholder="请输入检索条件"/></div>
        <div style="width:50px;height:50px;line-height:50px;background-color:#00f;position:absolute;top:0;right:0;text-align:center;color:#fff;">检索</div>
    </div>
</html>

posted @ 2017-05-19 21:30  小破孩123  阅读(282)  评论(0)  编辑  收藏  举报