Layui实现一个简单的布局

最新推荐文章于 2024-05-24 23:39:00 发布

编码的三叔

最新推荐文章于 2024-05-24 23:39:00 发布

阅读量3.9k

点赞数

分类专栏： LayUI 文章标签：前端

本文链接：https://blog.csdn.net/ppwwp/article/details/83015587

版权

LayUI 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>一个简单的例子</title>
        <link rel="stylesheet" href="layui/css/layui.css">
    </head>
    
    <body>
        <div class="layui-layout layui-layout-admin">
            <div class="layui-header layui-bg-black">
            	顶部
                <!-- 头部区域（可配合layui已有的水平导航） -->
            </div>
            <div class="layui-side layui-bg-black">
                <div class="layui-side-scroll">
                	左边
                    <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
                </div>
            </div>
            <div class="layui-body">
            	右边
                <!-- 内容主体区域 -->
            </div>
            <div class="layui-footer">
            	下边
                <!-- 底部固定区域 -->
            </div>
        </div>

	<script src="layui/layui.js"></script>      
	<script>
	//JavaScript代码区域
	</script>
    </body>
</html>

在这里插入图片描述

参照地址

编码的三叔

关注

0
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
Layui实现一个简单的布局

&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;一个简单的例子&lt;/title&gt; &lt;link rel="stylesheet" href="layui/c
复制链接

扫一扫