layui实现多种垂直时间线大事件效果代码
代码语言:html
所属分类:布局界面
代码描述:layui实现多种垂直时间线大事件效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Layui</title> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/js/layui/css/layui.css"> </head> <body style="margin:20px;"> <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;"> <legend>常规时间线</legend> </fieldset> <ul class="layui-timeline"> <li class="layui-timeline-item"> <i class="layui-icon layui-timeline-axis"></i> <div class="layui-timeline-content layui-text"> <h3 class="layui-timeline-title">8月18日</h3> <p> layui 2.0 的一切准备工作似乎都已到位。发布之弦,一触即发。 <br>不枉近百个日日夜夜与之为伴。因小而大,因弱而强。 <br>无论它能走多远,抑或如何支撑?至少我曾倾注全心,无怨无悔 <i class="layui-icon"></i> </p> </div> </li> <li class="layui-timeline-item"> <i class="layui-icon layui-timeline-axis"></i> <div class="layui-timeline-content layui-text"> <h3 class="layui-timeline-title">8月16日</h3> <p>杜甫的思想核心是儒家的仁政思想,他有<em>“致君尧舜上,再使风俗淳”</em>的宏伟抱负。个人最爱的名篇有:</p> <ul> <li>《登高》</li> <li>《茅屋为秋风所破歌》</li> </ul> </div> </li> <li class="layui-timeline-item"> <i class="layui-icon layui-timeline-axis"></i> <div class="layui-timeline-content layui-text"> <h3 class="layui-timeline-title">8月15日</h3> <p> 中国人民抗日战争胜利日 <br>铭记、感恩 <br>所有为中华民族浴血奋战的英雄将士 <br>永垂不朽 </p> </div> </li> <li class="layui-timeline-item"> <i class="layui-icon layui-timeline-axis"></i> <div class="layui-timeline-content layui-text"> .........完整代码请登录后点击上方下载按钮下载查看
网友评论0