layui 移动端最简布局

复制代码
<script>
    function changeFrameHeight() {
        var iframe = document.getElementsByClassName("iframe");
        for (var i = 0; i < iframe.length; i++) {
            iframe[i].height = document.documentElement.clientHeight-75;
        }
       
    }
    window.onload = function () {
        changeFrameHeight();
    }
</script>
<body>
    <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
        <div class="layui-tab-content">
            <div class="layui-tab-item layui-show">
            <iframe 
                    class="iframe"
                    height="100%"
                    width="100%"
                    src="https://www.baidu.com"
                    scrolling="auto"
                    frameborder="0">
                </iframe>

            </div>
            <div class="layui-tab-item">内容2</div>
            <div class="layui-tab-item">内容3</div>
            <div class="layui-tab-item">内容4</div>
        </div>
        <ul class="layui-tab-title layer-footer layui-bg-black" style="position: fixed; bottom: 0;width:100%;height:50px">
            <li class="layui-this">首页</li>
            <li>资讯</li>
            <li>兑换</li>
            <li>个人</li>
        </ul>


    </div>
</body>
复制代码

 

posted @   AnAng  阅读(1466)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· Docker 太简单,K8s 太复杂?w7panel 让容器管理更轻松!
历史上的今天:
2018-05-12 JsonClassGenerAtor 使用json字符串生成对象
点击右上角即可分享
微信分享提示