小网页学习开发02简单列表02 

<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
div{
position:absolute;
top:22%;
left:20%;
background-color:skyblue;

}
.c1{
width:940px;
height:80px;
background-image:url("6.jpg");
text-align:center;
font-size:40px;
color:green;
font-weight:bold;
font-family:微软雅黑;

}

div ul{
list-style:none;
}
div ul li{

font-family:宋体;
font-size:30px;
}
span{
font-size:40px;


}
.s1{
color:red;

}
.s2{
color:red;

}
.s3{
color:red;

}



</style>
</head>
<body>
<div>


<ul>
<li class="c1">热门点击排行</li>
<li><span class="s1">1</span>我省57家事业单位公开招聘岗位157个</li>
<li><span class="s2">2</span>我省57家事业单位公开招聘岗位157个</li>
<li><span class="s3">3</span>我省57家事业单位公开招聘岗位157个</li>
<li><span>4</span>我省57家事业单位公开招聘岗位157个</li>
<li><span>5</span>我省57家事业单位公开招聘岗位157个 </li>
<li><span>6</span>我省57家事业单位公开招聘岗位157个</li>

</div>



</ul>

</div>
</body>
<html>

　　效果图：

posted @ 2017-07-23 18:21  毕竟冬哥一场梦  阅读(66)  评论(0)    收藏  举报