html 实例源码
实例源码：
源代码：
执行
执行中...
x
1
<!DOCTYPE html>2
<html>3
<head>4
<meta charset="utf-8"> 5
<title>时代Java与您共同学习(NowJava.com)</title> 6
<style>7
ul.pagination {8
display: inline-block;9
padding: 0;10
margin: 0;11
}12
13
ul.pagination li {display: inline;}14
15
ul.pagination li a {16
color: black;17
float: left;18
padding: 8px 16px;19
text-decoration: none;20
transition: background-color .3s;21
}22
23
ul.pagination li a.active {24
background-color: #4CAF50;25
color: white;26
}27
28
ul.pagination li a:hover:not(.active) {background-color: #ddd;}29
</style>30
</head>31
<body>32
33
<h2>鼠标悬停过渡效果</h2>34
<p>鼠标移动到分页码上。</p>35
<ul class="pagination">36
<li><a href="#">«</a></li>37
<li><a href="#">1</a></li>38
<li><a class="active" href="#">2</a></li>39
<li><a href="#">3</a></li>40
<li><a href="#">4</a></li>41
/**代码未完, 请加载全部代码(NowJava.com).**/执行结果：
本文系作者在时代Java发表，未经许可，不得转载。如有侵权，请联系nowjava@qq.com删除。
编辑于
关注时代Java