css多种简洁分页样式代码-html代码-BFW代码库

css多种简洁分页样式代码

代码语言：html

代码描述：css多种简洁分页样式代码

代码标签： css 分页

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
<style>
@import url('https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i');
	* {
	margin:0;
	padding:0;
	box-sizing:border-box
}
body {
	font-family:'Lato',sans-serif;
	font-size:14px;
	color:#999;
	word-wrap:break-word
}
ul {
	list-style:none
}
.center {
	width:100%;
	max-width:600px;
	margin:auto;
	padding:20px
}
.pagination {
	border-bottom:1px solid rgba(0,0,0,0.2);
	padding:15px 0
}
.pagination ul {
	display:flex;
	justify-content:center;
	flex-flow:row wrap
}
.pagination ul li {
	margin:0 5px 0 0;
	text-align:center;
	position:relative
}
.pagination ul li a,.pagination ul li a:link,.pagination ul li a:visited {
	text-decoration:none
}
.rounded-blocks li a,.rounded-blocks li a:link,.rounded-blocks li a:visited {
	color:white;
	display:block;
	text-shadow:1px 1px 0 rgba(0,0,0,.2);
	padding:6px 3px 0;
	border-radius:50%;
	background:#0dcadd;
	background:-moz-linear-gradient(180deg,#3deeff,#0dcadd);
	background:-webkit-linear-gradient(180deg,#3deeff,#0dcadd);
	background:-o-linear-gradient(180deg,#3deeff,#0dcadd);
	background:-ms-linear-gradient(180deg,#3deeff,#0dcadd);
	background:linear-gradient(180deg,#3deeff,#0dcadd);
	width:30px;
	height:30px;
	border-left:1px solid rgba(0,0,0,0.2);
	border-right:1px solid rgba(0,0,0,0.2);
	transition:.1s
}
.rounded-blocks li a:hover,.rounded-blocks li.active a {
	color:yellow;
	border-radius:5px;
	background:#0dcadd;
	background:-moz-linear-gradient(180deg,#0dcadd,#3deeff);
	background:-webkit-linear-gradient(180deg,#0dcadd,#3deeff);
	background:-o-linear-gradient(180deg,#0dcadd,#3deeff);
	background:-ms-linear-gradient(180deg,#0dcadd,#3deeff);
	background:linear-gradient(180deg,#0dcadd,#3deeff)
}
.rounded-blocks li:first-of-type a,.rounded-blocks li:last-of-type a {
	width:auto;
	border-radius:25px 0 0 25px;
	padding:6px 25.........完整代码请登录后点击上方下载按钮下载查看