左侧固定，右侧自适应的两种方法

最新推荐文章于 2021-08-27 20:08:01 发布

玉儿Qi

最新推荐文章于 2021-08-27 20:08:01 发布

阅读量424

点赞数

分类专栏：前端开发

本文链接：https://blog.csdn.net/u014328357/article/details/65442962

版权

前端开发专栏收录该内容

227 篇文章 0 订阅

订阅专栏

方法一：使用并列的两个div，一个position:abosolute，一个设置margin-left
代码：

<body>
    <div id="test1">
        <div id="test1_1"></div>
        <div id="test1_2"></div>
    </div>
</body>

<style type="text/css">
    #test1{
        width:50%;
        height:100px;
        border:1px blue solid;
        position: relative;
        padding:10px;
    }
    #test1_1{
        width: 100px;
        height: 100px;
        border:1px black solid;
        position: absolute;
    }
    #test1_2{
        height: 100px;
        margin-left:110px;
        border:1px green solid;
    }
</style>

方法二，使用iframeset/iframe：

<html>
    <frameset cols="200px,50%,50%">
        <frame src="/example/html/frame_a.html">
        <frame src="/example/html/frame_b.html">
        <frame src="/example/html/frame_c.html">
    </frameset>
</html>

玉儿Qi

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
左侧固定，右侧自适应的两种方法

方法一：使用并列的两个div，一个position:abosolute，一个设置margin-left 代码：<body> <div id="test1"> <div id="test1_1"></div> <div id="test1_2"></div> </div></body><style type="text/css"> #test
复制链接

扫一扫