css实现自适应时间轴时间线大事记效果代码-html代码-BFW代码库

css实现自适应时间轴时间线大事记效果代码

代码语言：html

所属分类：响应式

代码描述：css实现自适应时间轴时间线大事记效果代码

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

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

<head>
    <meta charset="UTF-8">
<style>
  body {
	margin:0;
	padding:0;
	background:#e6e6e6;
	color:#323232;
	font-family:'Open Sans',sans-serif;
	font-size:112.5%;
	line-height:1.6em
}
.timeline {
	position:relative;
	width:660px;
	margin:0 auto;
	margin-top:20px;
	padding:1em 0;
	list-style-type:none
}
.timeline:before {
	position:absolute;
	left:50%;
	top:0;
	content:' ';
	display:block;
	width:6px;
	height:100%;
	margin-left:-3px;
	background:#505050;
	background:-moz-linear-gradient(top,rgba(80,80,80,0) 0,#505050 8%,#505050 92%,rgba(80,80,80,0) 100%);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(30,87,153,1)),color-stop(100%,rgba(125,185,232,1)));
	background:-webkit-linear-gradient(top,rgba(80,80,80,0) 0,#505050 8%,#505050 92%,rgba(80,80,80,0) 100%);
	background:-o-linear-gradient(top,rgba(80,80,80,0) 0,#505050 8%,#505050 92%,rgba(80,80,80,0) 100%);
	background:-ms-linear-gradient(top,rgba(80,80,80,0) 0,#505050 8%,#505050 92%,rgba(80,80,80,0) 100%);
	.........完整代码请登录后点击上方下载按钮下载查看