html代码
编写的是喜马拉雅的页面
Document
| 猜你喜欢
选择这个可以不用链接后端但是需要自行改一下代码
| 有声书
- 斗破苍穹 |
- 盗墓笔记 |
- 一剑独尊 |
- 三体 |
- 大魏读书人 |
- 免费听全版小说
-
完本
她是天才特工,第一次任务却惨遭失败穿越掉落龙床,打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
骤雨惊弦
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
有声的紫襟
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
王明军演播
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
有声的紫襟
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
喜马拉雅
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
君言讲故事
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
有声的紫襟
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
王明军演播
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
有声的紫襟
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
喜马拉雅
| 相声评书
- 隋唐演义 |
- 相声 |
- 杨家将 |
- 听相声学成语 |
- 相声大全 |
- 岳飞传
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
君言讲故事
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
有声的紫襟
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
王明军演播
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
有声的紫襟
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
喜马拉雅
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
君言讲故事
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
有声的紫襟
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
王明军演播
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
有声的紫襟
-
完本
打断暴君的动作片。身中迷药的她,却把暴君当做
了鸭,吃干抹净就走,还留下小费?这个女人欺人太甚!然而暴君是用来虐的,钱是随便花的,武功是欺负弱小的
,美貌嘛嘿嘿自然是拿来挑逗帅哥的……
喜马拉雅
| 儿童
- 莫西西魔法日记 |
- 闹闹别闹上学计 |
- 装在口袋里的爸 |
- 十万个为什么 |
- 成语故事 |
- 猫爪怪探团
-
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。
君言讲故事
-
完本
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。…
有声的紫襟
-
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。…
王明军演播
-
完本
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。
有声的紫襟
-
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。
喜马拉雅
-
完本
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。
君言讲故事
-
完本
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。
有声的紫襟
-
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。
王明军演播
-
完本
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决
定孩子的一生是否会感到幸福和满足。
有声的紫襟
-
完本
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影
响,并决定孩子的一生是否会感到幸福和满足。
喜马拉雅
| 娱乐
- 莫西西魔法日记 |
- 闹闹别闹上学计 |
- 装在口袋里的爸 |
- 十万个为什么 |
- 成语故事 |
- 猫爪怪探团
-
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。
君言讲故事
-
完本
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。…
有声的紫襟
-
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。…
王明军演播
-
完本
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。
有声的紫襟
-
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。
喜马拉雅
-
完本
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。
君言讲故事
-
完本
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。
有声的紫襟
-
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决定孩子的一生是否会感到幸福和满足。
王明军演播
-
完本
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影响,并决
定孩子的一生是否会感到幸福和满足。
有声的紫襟
-
完本
每个家长都期盼自己的孩子能在将来成长为一位优秀的人才,而热爱阅读的孩子恰恰是最具发展前途的。
在他们求知欲强、记忆力强的最美好的童年时光,用各种优秀、美妙的故事浸润心灵,必将对其成长产生深远的影
响,并决定孩子的一生是否会感到幸福和满足。
喜马拉雅
热播榜
郭德纲21年相声精选
德云社郭德纲相声vip
大奉打更人
头陀渊讲故事
米小圈上学记
米小圈
- 4 重生八零,媳妇有点辣 | 免费多人有声剧
- 5 先快报
- 6 雪中悍刀行 无删减版免费听|大斌
- 7 一剑独尊(叶玄叶灵 | 有声的紫襟 | 男女双播)
- 8 白眉大侠 | 单田芳(400回完)
- 9 德云社相声精选集(365天高清伴睡版)
- 10 晚安妈妈睡前故事
css的代码
header .title {
width: 100%;
height: 60px;
border-bottom: 2px solid silver;
}
header .pindao .select {
position: absolute;
z-index: 10;
display: none;
width: 600px;
height: 200px;
}
header .pindao .select li {
list-style: none;
display: inline-block;
width: 80px;
height: 20px;
background-color: silver;
border-radius: 20px;
margin-top: 40px;
}
header .pindao .select li:hover {
background-color: red;
}
header .pindao:hover .select {
display: block;
}
header img {
width: 290px;
height: 60px;
display: flex;
}
header span {
display: inline-block;
height: 60px;
width: 32px;
margin-left: 70px;
}
header a:hover span {
color: red;
}
header input {
width: 298px;
height: 40px;
border-radius: 30px;
border: 1px solid red;
margin-left: 300px;
margin-top: 20px;
margin-bottom: 20px;
}
header ul {
float: right;
}
header ul li {
list-style: none;
display: inline-block;
margin-top: 10px;
margin-right: 5px;
text-align: center;
}
header ul li img {
width: 44px;
height: 32px;
text-align: center;
}
header ul li p:hover {
color: red;
}
header ul li img.irl {
width: 50px;
height: 50px;
}
section.picture {
width: 100vw;
overflow: hidden;
margin-top: 20px;
}
section.picture .picture-img {
width: 500vw;
height: 280px;
display: flex;
justify-content: space-around;
animation: mylunbo 8s infinite;
}
section.picture img {
width: 60vw;
height: 280px;
border-radius: 10px;
}
@keyframes mylunbo {
0%,
25% {
transform: translateX(0);
}
25%,
50% {
transform: translateX(-100vw);
}
50%,
75% {
transform: translateX(-200vw);
}
75%,
99% {
transform: translateX(-300vw);
}
99%,
100% {
transform: translateX(-400vw);
}
}
section.one .title1 li {
list-style: none;
display: inline-block;
}
section.one .title1 li img {
margin-top: 10px;
width: 40px;
height: 40px;
margin-left: 180px;
}
section.one .title1 li p {
margin-left: 182px;
margin-bottom: 10px;
}
section.one .title1 li p:hover {
color: red;
}
section.one .title2 li {
display: inline-block;
list-style: none;
margin-left: 180px;
margin-top: 10px;
}
section.one .title2 span {
color: #40404c;
}
section.one .title2 a {
text-decoration: none;
}
section.one .title2 a:hover span {
color: red;
}
section.two a {
text-decoration: none;
}
section.two span {
display: inline-block;
margin-left: 180px;
margin-top: 20px;
font-size: 35px;
font-weight: 600;
color: #40404c;
}
section.two a:hover span {
color: red;
}
section.three .cnxh {
width: 1400px;
height: 250px;
margin: auto;
display: flex;
justify-content: space-around;
align-items: center;
}
section.three .cnxh div {
margin: 10px;
}
section.three .cnxh div div {
width: 140px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-weight: 600;
}
section.three .cnxh div:hover {
box-shadow: 0 15px 20px rgba(0, 0, 0, 0.5);
}
section.three .cnxh div:hover img {
margin-left: 8px;
}
section.three li {
list-style: none;
display: inline-block;
margin-top: 20px;
margin-left: 130px;
}
section.three li:hover {
box-shadow: 0 15px 20px rgba(0, 0, 0, 0.5);
}
section.three img {
width: 145px;
height: 145px;
}
section.three p {
width: 140px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-weight: 600;
}
section.three p:hover {
color: red;
}
section.three a:hover span {
color: red;
}
section.four a {
text-decoration: none;
}
section.four span {
display: inline-block;
margin-left: 180px;
margin-top: 20px;
font-size: 35px;
font-weight: 600;
color: #40404c;
}
section.four a:hover span {
color: red;
}
section.four ul {
margin-left: 180px;
}
section.four li {
list-style: none;
display: inline-block;
width: 160px;
}
section.four li:hover {
color: red;
}
section.five li {
list-style: none;
display: inline-block;
margin-top: 20px;
margin-left: 130px;
}
section.five li:hover {
box-shadow: 0 15px 20px rgba(0, 0, 0, 0.5);
}
section.five img {
width: 145px;
height: 145px;
}
section.five p {
width: 140px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-weight: 600;
}
section.five p span.w {
background-color: #78c10a;
color: white;
}
section.five p:hover {
color: red;
}
section.five a:hover span {
color: red;
}
section.six {
margin-left: 120px;
margin-top: 20px;
float: left;
margin-left: 360px;
}
section.six h4 {
color: #463e31;
font-size: 22px;
}
section.six .six2 img {
width: 60px;
height: 60px;
margin-top: 10px;
}
section.six .six2 li {
width: 240px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
section.six .six2 li div {
float: right;
margin-top: 20px;
margin-right: 30px;
}
section.six .six2 li .six3 {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
font-size: 14px;
line-height: 20px;
max-width: 100%;
color: #40404c;
}
section.six .six2 li .six4 {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
font-size: 12px;
max-width: 100%;
color: #a3a3ac;
line-height: 20px;
}
section.six .six2 li:hover {
color: red;
}
.six5 {
float: right;
margin-right: 400px;
}
.six5 img {
height: 400px;
width: 250px;
}
.six6 {
float: right;
}
.six6 img {
height: 400px;
width: 250px;
}
footer {
margin-top: 30px;
}
至于图片就自行搞定吧大部分都是有网就行的,少数图片是需要下载的在网上下载就行了
成品展示
猜你喜欢哪里是需要后端渲=渲染才能出现图片的的,或者使用第二种方法




169EJSB8K[0K0(M.png)

B.png)







