畅销书排行榜

最新推荐文章于 2023-04-28 19:39:25 发布

四维空间中的未知点

最新推荐文章于 2023-04-28 19:39:25 发布

阅读量1k

点赞数 2

分类专栏：前端文章标签： html 前端 css

本文链接：https://blog.csdn.net/CNSA183_20/article/details/121665598

版权

前端专栏收录该内容

5 篇文章 2 订阅

订阅专栏

HTML:

<!DOCTYPE html>
<html>
<head>
	<title>畅销书排行榜</title>
	<link rel="stylesheet" type="text/css" href="css/畅销书排行榜.css">
</head>
<body>
	<h1 class="title">畅销书排行榜</h1>
	<ul>
		<li class="li1"><a href="#">不抱怨的世界(畅...</a></li>
		<li class="li2"><a href="#">遇见未知的自己...</li>
		<li class="li3"><a href="#">活法（季羡林、...</li>
		<li class="li4"><a href="#">高效能人士的七个习惯</li>
		<li class="li5"><a href="#">被迫强大（北外女生香奈儿...</li>
		<li class="li6"><a href="#">遇见心想事成的自己（《遇...</li>
		<li class="li7"><a href="#">世界上最伟大的推销员（插...</li>
		<li class="li8"><a href="#">我的成功可以复制（唐骏亲...</li>
		<li class="li9"><a href="#">少有人走的路：心智成熟的...</li>
		<li class="li10"><a href="#">活出全新的自己——唤醒...</li>
	</ul>
</body>
</html>

CSS:

.title {
    font-size: 16px;
    text-indent: 1em;
    line-height: 30px;
    color: #fff;
    background-color: #518700;
    background-image: url(../image/bang.gif);
    background-repeat: no-repeat;
    background-position: 120px 50%;
    margin: 0px;
}
ul li{
	list-style-type: none;
	text-indent: 2em;
	font-size: 12px;
	line-height: 28px;
	color: #1a66b3;
}
a{
	text-decoration: none;
}
a:hover{
	text-decoration: underline;
}
ul{
    background: linear-gradient(to right bottom, #F9FBCB, #F8F8F3);
    margin: 0px;
}
.li1{
	background-image: url(../image/book_no01.gif);
	background-repeat: no-repeat;
	background-position: 0px 50%;
}
.li2{
	background-image: url(../image/book_no02.gif);
	background-repeat: no-repeat;
	background-position: 0px 50%;
}
.li3{
	background-image: url(../image/book_no03.gif);
	background-repeat: no-repeat;
	background-position: 0px 50%;
}
.li4{
	background-image: url(../image/book_no04.gif);
	background-repeat: no-repeat;
	background-position: 0px 50%;
}
.li5{
	background-image: url(../image/book_no05.gif);
	background-repeat: no-repeat;
	background-position: 0px 50%;
}
.li6{
	background-image: url(../image/book_no06.gif);
	background-repeat: no-repeat;
	background-position: 0px 50%;
}
.li7{
	background-image: url(../image/book_no07.gif);
	background-repeat: no-repeat;
	background-position: 0px 50%;
}
.li8{
	background-image: url(../image/book_no08.gif);
	background-repeat: no-repeat;
	background-position: 0px 50%;
}
.li9{
	background-image: url(../image/book_no09.gif);
	background-repeat: no-repeat;
	background-position: 0px 50%;
}
.li10{
	background-image: url(../image/book_no10.gif);
	background-repeat: no-repeat;
	background-position: 0px 50%;
}

四维空间中的未知点

关注

2
点赞
踩
15

收藏

觉得还不错? 一键收藏
打赏
0
评论
畅销书排行榜

HTML:<!DOCTYPE html><html><head> <title>畅销书排行榜</title> <link rel="stylesheet" type="text/css" href="css/畅销书排行榜.css"></head><body> <h1 class="title">畅销书排行榜</h1> <ul> <li class
复制链接

扫一扫