前端HTML5简单布局

最新推荐文章于 2023-12-05 14:10:18 发布

wuliuqi62

最新推荐文章于 2023-12-05 14:10:18 发布

阅读量178

点赞数 1

本文链接：https://blog.csdn.net/wuliuqi62/article/details/103718479

版权

前端HTML5简单布局

这是第一次写CSDN博客，希望可以对一起学习前端的同学有些帮也记录一下自己的学习过程，监督自己。



Table布局

<!DOCTYPE html>

<html
lang="en">

<head>

    <meta
charset="UTF-8">

    <title>table布局</title>

</head>

<body
marginwidth="0px"
marginheight="0px">

<table
width="100%" height="900" style="background-color: darkgrey">

    <tr>

        <td
colspan="3" width="100%" height="10%" style="background-color: cadetblue">头部</td>

    </tr>

    <tr>

        <td
width="20%" height="80%" style="background-color: lightblue">

            <ol
start="1">

                <li>动物</li>

                <li>植物</li>

            </ol>

        </td>

        <td
width="60%" height="80%" style="background-color: lightskyblue">内容主体</td>

        <td
width="20%" height="80%" style="background-color: greenyellow">右菜单</td>

    </tr>

    <tr>

        <td
colspan="3" width="100%" height="10%" style="background-color: orange">底部</td>

    </tr>

</table>



</body>

结果
配色不好看，凑合凑合吧