grayzhao
/
IOmga


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
							<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>IOmga</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='bootstrap-v4.6.2/css/bootstrap.min.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='layui-v2.9.7/css/layui.css') }}">
    <style>
        /* 字体集 */
        @font-face {
            font-family: "思源黑体 Regular";
            font-weight: 400;
            src: url("{{ url_for('static', filename='font/SourceHanSans.Regular.woff2') }}") format("woff2"),
            url("{{ url_for('static', filename='font/SourceHanSans.Regular.woff') }}") format("woff");
            font-display: swap;
        }

        body, html {
            height: 100%;
            margin: 0;
            padding: 0;
            font-family: '思源黑体 Regular', Helvetica, 'Microsoft YaHei', Arial, sans-serif;
        }

        .comic-header {
            margin-top: 25px;
        }

        .comic-cover {
            flex-shrink: 0;
            width: 196px;
            height: 261px;
        }

        .comic-work {
            padding: 0 15px;
            height: 261px;
        }

        .work-desc {
            padding-top: 16px;
        }

        .comic-body {
            height: calc(100% - 261px - 25px - 25px);
            margin-top: 25px;
        }
    </style>
</head>
<body>
<div class="layui-layout layui-fluid" style="height: 100%; padding: 0">
    <div class="layui-row" style="height: 100%">
        <div class="layui-col-xs8 layui-col-xs-offset2 layui-col-md6 layui-col-md-offset3" style="height: 100%;">
            <div class="layui-row comic-header">
                <div class="layui-col-xs4">
                    <img src="https://www.wetools.com/placeholder/160x213?fontsize=30" class="comic-cover rounded" alt="...">
                </div>
                <div class="layui-col-xs8 comic-work">
                    <div class="layui-text">
                        <h2>你当像鸟飞往你的山</h2>
                        <p class="overflow-auto" style="height: 154px">
                            人们只看到我的与众不同：一个十七岁前从未踏入教室的大山女孩，却戴上一顶学历的高帽，熠熠生辉。只有我知道自己的真面目：我来自一个极少有人能想象的家庭。我的童年由垃圾场的废铜烂铁铸成，那里没有读书声，只有起重机的轰鸣。不上学，不就医，是父亲要我们坚持的忠诚与真理。父亲不允许我们拥有自己的声音，我们的意志是他眼中的恶魔。哈佛大学，剑桥大学，哲学硕士，历史博士……我知道，像我这样从垃圾堆里爬出来的无知女孩，能取得如今的成就，应当感激涕零才对。但我丝毫提不起热情。我曾怯懦、崩溃、自我怀疑，内心里有什么东西腐烂了，恶臭熏天。直到我逃离大山，打开另一个世界。那是教育给我的新世界，那是我生命的无限可能。
                        </p>
                    </div>
                    <div class="layui-row work-desc">
                        <div class="layui-row">
                            <div class="layui-col-xs6">
                                <p>作者: 塔拉·韦斯特弗</p>
                            </div>
                            <div class="layui-col-xs6">
                                <p>标签: 文学、励志</p>
                            </div>
                        </div>
                        <div class="layui-row" style="padding-top: 8px">
                            <p>更新日期: 2019-10-24</p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-row comic-body border border-secondary rounded">
                <div class="layui-row"></div>
                <div class="layui-row"></div>
            </div>
        </div>
    </div>
</div>

<!-- 引入 layui.js 的 <script> 标签最好放置在 html 末尾 -->
<script src="{{ url_for('static', filename='js/jquery-3.7.1.min.js') }}"></script>
<script src="{{ url_for('static', filename='bootstrap-v4.6.2/js/bootstrap.bundle.min.js') }}"></script>
<script src="{{ url_for('static', filename='layui-v2.9.7/layui.js') }}"></script>
<script>
    $(function () {
        $('[data-toggle="tooltip"]').tooltip()
    })

    layui.config({
        base: "{{ url_for('static', filename='layui-modules/') }}",
        version: true
    }).use(["layer", "form", "laypage", "element", "util"], function () {
        var layer = layui.layer
            , form = layui.form
            , laypage = layui.laypage
            , element = layui.element
            , util = layui.util;

        // tab 删除事件
        element.on('tabDelete(body-handle)', function (data) {
            console.log(data.index); // 得到被删除的 tab 项的所在下标
            console.log(data.elem); // 得到当前的 tab 容器
        });

        // 自定义每页条数的选择项
        laypage.render({
            elem: 'card-laypage-limits',
            count: 1000,
            limit: 100,
            limits: [100, 300, 500],
            layout: ['prev', 'page', 'next', 'limit']
        });

    });
</script>
</body>
</html>