品字形框架布局

最新推荐文章于 2022-04-25 00:10:19 发布

慢慢行的蜗牛

最新推荐文章于 2022-04-25 00:10:19 发布

阅读量2.6k

点赞数

分类专栏： html5

本文链接：https://blog.csdn.net/zhaobinglong/article/details/28425275

版权

html5 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

注意：使用frameset标签意味着必须去掉body标签，否则frameset标签无效果

1.清除常用标签默认样式

*{margin: 0;padding: 0;list-style: none;}

2.使用框架品字形架构

<frameset rows="150px,100%" <span style="background-color: rgb(251, 234, 216); color: rgb(73, 73, 73); font-size: 14px; line-height: 21px; white-space: normal; ">frameborder="no"></span>
        <frame name="head" src="index.php/Index/head" noresize="noresize" ></frame>
        <frameset cols="300px,100%" <span style="background-color: rgb(251, 234, 216); color: rgb(73, 73, 73); font-size: 14px; line-height: 21px; white-space: normal; ">frameborder="no"></span>
        <frame name="left" src="index.php/Index/left" noresize="noresize"></frame>
        <frame name="right" src="index.php/Index/right" noresize="noresize"></frame>
        </frameset>
    </frameset>

3. 清除边框固定尺寸 ;

<pre style="white-space: normal; color: rgb(73, 73, 73); font-size: 14px; line-height: 21px; background-color: rgb(251, 234, 216); ">frameborder="no"  noresize="noresize"

4.rows属性规定每行的高度，可使用像素 % ，*代表覆盖剩余尺寸 cols代表宽度

PS:subline添加注释快捷键： ctrl+/