CSS制作上一页 下一页 页码显示样式

CSS制作上一页 下一页 页码显示样式

今天教大家制作页面的上一页 下一页 页码显示样式,效果如图所示。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>CSS制作上一页 下一页 页码显示样式|www.125jz.com</title>
<style>
a {
  width: 30px;
  height: 20px;
  line-height: 25px;
  font: 12px/20px "宋体";
  border: 1px solid #e0e1e2;
  display: inline-block;
  text-align: center;
  color: #2052a3;
}

.shang {
  width: 64px;
}

a:hover, .active {
  background-color: #1f3a87;
  color: #fff;
}
</style>
</head>
<body>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<div> <a class="shang">上一页</a> <a>1</a> <a>2</a> <a class="active">3</a> <a>4</a> <a>5</a> <a>6</a> <a>7</a> <a>8</a> <a>9</a> <a class="shang">下一页</a> </div>
</body>
</html>

125jz网原创文章。发布者:江山如画,转载请注明出处:http://www.125jz.com/2313.html

(1)
江山如画的头像江山如画管理团队
CSS制作三行二列居中布局,高度自适应
上一篇 2018年7月29日 下午12:05
会移动的文字 marquee标签(入门到高级)
下一篇 2018年7月30日 上午9:48

99%的人还看了以下文章

  • Marquee标签实现跑马灯、滚动公告、通知效果

    1.Marquee基本语法 <marquee> … </marquee> 实例演示:会移动的文字(Marquee) <marquee>啦啦啦,我会移动耶!</marquee> 2.文字移动属性 (1)方向 :direction=# #=left, right,up,down 例: <marqu…

    2019年2月26日
    11.9K0
  • CSS图形绘制练习-最常见的40种形状和图形源码分享

    CSS图形绘制练习-最常见的40种形状和图形源码分享CSS图形绘制练习-最常见的40种形状和图形源码分享CSS图形绘制练习-最常见的40种形状和图形源码分享CSS图形绘制练习-最常见的40种形状和图形源码分享

     CSS3可以实现很多漂亮的图形,本文从互联网收集了最常见的40种形状和图形,现分享给大家。 包括圆形,椭圆形,三角形,倒三角形,左三角形,右三角形,菱形,梯形,长方形,正方形,圆环,平行四边形,五角星,六角星,五边形,六边形,八边形,心形,蛋形,无穷符号,消息提示框,钻石,八卦图,食豆人,扇形,月牙,顶左直角三角形,顶右直角三角形 ,底左直角三角形 ,底右…

    2020年2月22日 网页制作
    14.8K0
  • 跟永哥学HTML5(6):H5表单及表单验证

    表单在网页中主要负责数据采集功能。HTML 5一个令人兴奋的发展领域是新的Web表单。
    在今天的课程中你会看到浏览器会验证所需的字段,数据类型,如电子邮件、网址和任何模式,而不使用任何JavaScript。

    2018年2月27日
    9.6K0
  • div+css实现面包屑导航-默认竖线分隔、箭头分隔、空白分隔

    div+css实现面包屑导航,主要用到了CSS3伪元素before,大家可以通过本利好好理解before的使用方法,下面125建站网给出实现代码。 <!DOCTYPE html> <html> <head> <meta charset=”utf-8″> <title></title> &…

    2023年1月5日
    2.3K0
  • 第7课:HTML标签的属性

    许多元素都可以设置属性。 属性是什么? HTML通过标签告诉浏览器如何展示网页(比如告诉浏览器显示一个换行)。你可以为某些元素附加一些信息,这些附加信息被称为属性(attribute)。例1: <h2 style=”background-color: #ff0000;”>上125jz.com学网页制作</h2> 属性应写在元素的首标签…

    2018年1月20日
    3.5K0
  • FLV视频播放代码及Flvplayer.swf播放器下载

    FLV是被众多新一代视频分享网站所采用,是目前增长最快、最为广泛的视频传播格式。 FLV 是FLASH VIDEO的简称,它形成的文件极小、加载速度极快,有效地解决了视频文件在网络上很好的使用等问题。 下面分享在网页制作时,插入FLV格式视频的代码(兼容主流浏览器): <object class id=”clsid:D27CDB6E-AE6D-11cf…

    2018年5月14日
    10.7K0

发表回复

登录后才能评论