zoukankan html css js c++ java

左侧固定右侧宽度自适应

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>无标题文档</title>
    <style type="text/css">
        * {
            padding: 0px;
            margin: 0px;
        }

        body {
            color: #FFF;
            font-size: 24px;
            text-align: center;
        }

        .left {
            width: 120px;
            height: auto !important;
            height: auto;
            min-height: 300px;
            float: left;
            background: #F00;
        }

        .right {
            width: 100%;
            height: 300px;
            background: #36F;
        }

        .container {
        }

        .foot {
            width: 100%;
            height: 30px;
            background: #000;
        }
    </style>
</head>

<body>
<div class="container">
    <div class="left">
        左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>
    </div>
    <div class="right">右</div>
    <div style="clear:both"></div>
</div>
<div class="foot">footer</div>
</body>
</html>

查看全文

相关阅读:
javaSE基础知识点
 java自定义注解
 java自定义线程池
 java写投票脚本自动化初探
 java线程安全初窥探
 锁的深入理解
 java守护线程与非守护线程
 java设计模式初探
 java内存模型初窥探
 uniapp中组件之间跳转遇到的问题

原文地址：https://www.cnblogs.com/ganler1988/p/3197581.html

左侧固定 右侧宽度自适应

左侧固定右侧宽度自适应