master

分支 (1)

管理

管理

master

bilibili_-pc
/
index.html

<!--
 * @Author: 孙大大
 * @Date: 2022-01-24 19:14:54
 * @LastEditTime: 2022-01-30 16:46:32
 * @FilePath: \bilibili\index.html
-->
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta
            name="keywords"
            content="哔哩哔哩, 哔哩哔哩漫画, bilibili 漫画官方网站, 漫画,动画, 原创, 正版, 海贼王, 五等分的新娘, 约定的梦幻岛, 辉夜大小姐想让我告白 ~天才们的恋爱头脑战~, 关于我转生变成史莱姆这档事, 我的英雄学园, 修真聊天群, 乔乔的奇妙冒险, 斗罗大陆, 一拳超人, 灵能百分百, 铳梦"
        />
        <meta
            name="description"
            content="哔哩哔哩正版漫画阅读平台, 海量官方漫画连载在线观看, 二次元动漫迷的追漫神器, 热门漫画: 海贼王, 五等分的新娘, 约定的梦幻岛, 辉夜大小姐想让我告白 ~天才们的恋爱头脑战~, 关于我转生变成史莱姆这档事, 我的英雄学园, 修真聊天群, 乔乔的奇妙冒险, 斗罗大陆, 我家大师兄脑子有坑, 一拳超人, 灵能百分百, 铳梦等"
        />
        <link rel="icon" href="./favicon.ico" />
        <link rel="stylesheet" href="./css/base.css" />
        <link rel="stylesheet" href="./lib/首页大轮播/css/normalize.css" />
        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" />
        <link rel="stylesheet" href="./lib/首页大轮播/dist/partialviewslider.css" />
        <link rel="stylesheet" href="./css/index.css" />
        <title>哔哩哔哩漫画 - bilibili 正版漫画平台</title>
    </head>
    <body>
        <!-- 顶部固定导航栏 -->
        <div class="nav">
            <!-- 中间导航栏 -->
            <div class="nav_list">
                <!-- 左侧logo -->
                <div class="left">
                    <img src="./images/logo.png" class="nav_logo" />
                    <span class="nav_title">哔哩哔哩漫画</span>
                </div>

                <!-- 中间分类部分 -->
                <div class="middle">
                    <!-- 第一个 -->
                    <div class="one">
                        <img src="./images/nav-top-icon.png" />
                        <span id="one">主站</span>
                    </div>

                    <!-- 第二个 -->
                    <div class="two">
                        <span>首页</span>
                    </div>

                    <!-- 第三个 -->
                    <div class="three">
                        <span>分类</span>
                    </div>

                    <!-- 第四个 -->
                    <div class="four">
                        <span>更新</span>
                    </div>
                </div>

                <!-- 右边部分 -->
                <div class="right">
                    <!-- 第一个 -->
                    <div class="one">
                        <input type="text" class="one_ipt" placeholder="妹子太多,只好选择飞升" />
                        <span>
                            <img src="./images/search.svg" class="search" />
                        </span>
                    </div>

                    <!-- 第二个 -->
                    <div class="two">下载 APP</div>

                    <!-- 第三个 -->
                    <div class="three">历史</div>

                    <!-- 第四个 -->
                    <div class="four">追漫</div>

                    <!-- 第五个 -->
                    <div class="five">
                        <img src="./images/touxiang.jpg" />
                    </div>
                </div>
            </div>
        </div>

        <!-- 头部轮播图 -->
        <div class="lunbo container">
            <ul id="partial-view">
                <li>
                    <img src="./images/one.png" />
                </li>
                <li>
                    <img src="./images/two.jpg" />
                </li>
                <li>
                    <img src="./images/three.jpg" />
                </li>
            </ul>
        </div>

        <!-- 中部导航 -->
        <div class="middle_nav">
            <div class="nav_list">
                <span>
                    <a href="javascript:;">热血</a>
                </span>
                <span>
                    <a href="javascript:;">古风</a>
                </span>
                <span>
                    <a href="javascript:;">玄幻</a>
                </span>
                <span>
                    <a href="javascript:;">奇幻</a>
                </span>
                <span>
                    <a href="javascript:;">悬疑</a>
                </span>
                <span>
                    <a href="javascript:;">都市</a>
                </span>
                <span>
                    <a href="javascript:;">历史</a>
                </span>
                <span>
                    <a href="javascript:;">武侠仙侠</a>
                </span>
                <span>
                    <a href="javascript:;">游戏竞技</a>
                </span>
                <span>
                    <a href="javascript:;">悬疑灵异</a>
                </span>
                <span>
                    <a href="javascript:;">架空</a>
                </span>
                <span>
                    <a href="javascript:;">青春</a>
                </span>
                <span>
                    <a href="javascript:;">西幻</a>
                </span>
                <span>
                    <a href="javascript:;">现代</a>
                </span>
                <span>
                    <a href="javascript:;">全部 ></a>
                </span>
            </div>
        </div>

        <!-- 新人入坑神作 -->
        <div class="newPerson">
            <div class="middle w">
                <div class="text w">新人入坑神作</div>
                <div class="huan w"><i></i>换一批</div>
            </div>
        </div>

        <!-- 为你推荐 -->
        <div class="tuijian w">
            <div class="text">为你推荐</div>
            <div class="huan"><i></i>换一批</div>
        </div>
        <!-- 推荐列表 -->
        <div class="tuijian_list w">
            <div>
                <img src="./images/1.jpg" />
                <h3>我独自盗墓</h3>
                <span>都市</span>
            </div>
            <div>
                <img src="./images/2.jpg" />
                <h3>爷就是开挂少女</h3>
                <span>架空</span>
            </div>
            <div>
                <img src="./images/3.jpg" />
                <h3>从1级开始的异世界骑士</h3>
                <span>热血</span>
            </div>
            <div>
                <img src="./images/4.jpg" />
                <h3>骷髅奶爸</h3>
                <span>西幻</span>
            </div>
            <div>
                <img src="./images/5.jpg" />
                <h3>修罗武神</h3>
                <span>玄幻</span>
            </div>
            <div>
                <img src="./images/6.jpg" />
                <h3>垃圾堆里的皇女</h3>
                <span>都市</span>
            </div>
            <div>
                <img src="./images/7.jpg" />
                <h3>最强王者</h3>
                <span>游戏竞技</span>
            </div>
            <div>
                <img src="./images/8.jpg" />
                <h3>真理面具</h3>
                <span>悬疑灵异</span>
            </div>
            <div>
                <img src="./images/9.jpg" />
                <h3>桃花照玉案</h3>
                <span>古风</span>
            </div>
            <div>
                <img src="./images/10.jpg" />
                <h3>黑化王爷超难哄</h3>
                <span>古风</span>
            </div>
            <div>
                <img src="./images/11.jpg" />
                <h3>双胞胎兄妹的父皇是宠娃狂魔</h3>
                <span>西幻</span>
            </div>
            <div>
                <img src="./images/12.jpg" />
                <h3>我独自盗墓</h3>
                <span>都市</span>
            </div>
        </div>

        <!-- 热门速递 -->
        <div class="hot w">
            <div class="title">
                <div class="text w">
                    <span class="one">热门速递</span>
                    <span class="two">二次元养老院</span>
                    <span class="three">9.0分以上佳作</span>
                </div>
                <div class="huan"><i></i>换一批</div>
            </div>
            <div class="body">
                <div>
                    <img src="./images/j.jpg" />
                    <h3>刃牙道</h3>
                    <span>热血</span>
                </div>
                <div>
                    <img src="./images/p.png" />
                    <h3>全职猎人</h3>
                    <span>热血</span>
                </div>
                <div>
                    <img src="./images/k.png" />
                    <h3>犬夜叉(WIDE版本)</h3>
                    <span>古风</span>
                </div>
                <div>
                    <img src="./images/a.png" />
                    <h3>银魂</h3>
                    <span>都市</span>
                </div>
                <div>
                    <img src="./images/dong.png" />
                    <h3>妖精的尾巴</h3>
                    <span>热血</span>
                </div>
                <div>
                    <img src="./images/nan.jpg" />
                    <h3>重版出来！</h3>
                    <span>现代</span>
                </div>
                <div>
                    <img src="./images/xi.png" />
                    <h3>小林家的龙女仆</h3>
                    <span>我要给小林子生孩子</span>
                </div>
                <div>
                    <img src="./images/bei.jpg" />
                    <h3>爸妈来自二次元</h3>
                    <span>资深二次元父母X初入宅圈儿女</span>
                </div>
            </div>
        </div>

        <!-- 都市生活 -->
        <div class="tuijian city w">
            <div class="text">都市生活</div>
            <div class="huan"><i></i>换一批</div>
        </div>
        <!-- 推荐列表 -->
        <div class="tuijian_list w">
            <div>
                <img src="./images/1.jpg" />
                <h3>我独自盗墓</h3>
                <span>都市</span>
            </div>
            <div>
                <img src="./images/2.jpg" />
                <h3>爷就是开挂少女</h3>
                <span>架空</span>
            </div>
            <div>
                <img src="./images/3.jpg" />
                <h3>从1级开始的异世界骑士</h3>
                <span>热血</span>
            </div>
            <div>
                <img src="./images/4.jpg" />
                <h3>骷髅奶爸</h3>
                <span>西幻</span>
            </div>
            <div>
                <img src="./images/5.jpg" />
                <h3>修罗武神</h3>
                <span>玄幻</span>
            </div>
            <div>
                <img src="./images/6.jpg" />
                <h3>垃圾堆里的皇女</h3>
                <span>都市</span>
            </div>
        </div>

        <!-- 奇幻世界 -->
        <div class="tuijian magic w">
            <div class="text">都市生活</div>
            <div class="huan"><i></i>换一批</div>
        </div>
        <!-- 推荐列表 -->
        <div class="tuijian_list w">
            <div>
                <img src="./images/1.jpg" />
                <h3>我独自盗墓</h3>
                <span>都市</span>
            </div>
            <div>
                <img src="./images/2.jpg" />
                <h3>爷就是开挂少女</h3>
                <span>架空</span>
            </div>
            <div>
                <img src="./images/3.jpg" />
                <h3>从1级开始的异世界骑士</h3>
                <span>热血</span>
            </div>
            <div>
                <img src="./images/4.jpg" />
                <h3>骷髅奶爸</h3>
                <span>西幻</span>
            </div>
            <div>
                <img src="./images/5.jpg" />
                <h3>修罗武神</h3>
                <span>玄幻</span>
            </div>
            <div>
                <img src="./images/6.jpg" />
                <h3>垃圾堆里的皇女</h3>
                <span>都市</span>
            </div>
        </div>

        <!-- 底部 -->
        <footer>
            <div class="w">
                <div class="top">
                    <div class="logo">
                        <img src="./images/logo.png" />
                    </div>
                    <span class="title">哔哩哔哩漫画</span>
                    <div class="link">
                        <a href="javascript:;">关于我们</a>
                        <a href="javascript:;">练习我们</a>
                        <a href="javascript:;">友情链接</a>
                        <a href="javascript:;">加入我们</a>
                    </div>
                    <div class="line"></div>
                    <div class="pic">
                        <div>
                            <img src="./images/pic1.svg" />
                            <span>B站官号</span>
                        </div>
                        <div>
                            <img src="./images/pic2.png" />
                            <span>新浪微博</span>
                        </div>
                        <div>
                            <img src="./images/pic3.png" />
                            <span class="download">下载 bilibili 漫画客户端</span>
                        </div>
                    </div>
                </div>
                <div class="buttom">
                    <div class="left">
                        <div class="hezuo">
                            <img src="./images/hezuo.png" />
                        </div>
                        <div class="kankan">
                            <img src="./images/kankan.png" />
                        </div>
                    </div>
                    <div class="right">
                        <div>
                            互联网 ICP 备案：沪 ICP17039440 号 - 1 | 网络文化经营许可证：沪网文
                            [2020]5452-371 号
                        </div>
                        <div>
                            全国网安备案号：31011002003092 | 增值电信业务经营许可证 沪 B2-20190879
                        </div>
                        <div>12318 全国文化市场举报网站 | 上海市互联网违法和不良信息举报中心</div>
                        <div>
                            上海呵呵呵文化传播有限公司 | 地址：上海市杨浦区政立路485号 |
                            电话：021-25099888
                        </div>
                    </div>
                </div>
            </div>
        </footer>

        <!-- 电梯导航 -->
        <div class="floor">
            <ul class="ul">
                <li id="aaa">新人必看</li>
                <li id="bbb">为你推荐</li>
                <li id="ccc">热门速递</li>
                <li id="ddd">都市生活</li>
            </ul>
            <div class="top">
                <a href="#"><img src="./images/top.png" /></a>
            </div>
        </div>
    </body>
    <script src="./lib/首页大轮播/js/jquery-1.11.0.min.js"></script>
    <script src="./lib/首页大轮播/dist/partialviewslider.js"></script>
    <script src="./js/index.js"></script>
    <script>
        $(document).ready(function () {
            var partialView = $('#partial-view').partialViewSlider()

            $('#prev').on('click', function () {
                partialView.prev()
            })
            $('#next').on('click', function () {
                partialView.next()
            })
            $('#play').on('click', function () {
                partialView.play()
            })
            $('#pause').on('click', function () {
                partialView.pause()
            })
        })
    </script>
</html>