css实现简单垂直时间轴效果代码
代码语言:html
所属分类:布局界面
代码描述:css实现简单垂直时间轴效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style> * { margin: 0; padding: 0; } article,section,time,aside{display:block;} body { color: #9f9f9f; background: #fff; font-size: 1.16em; font-family: 'Lato', Calibri, Arial, sans-serif; } .point-time { content: ""; position: absolute; width: 13px; height: 13px; top: 17px; left: 20%; background: #1c87bf; margin-left: -4px; border-radius: 50%; box-shadow: 0 0 0 5px #fff; } .text-red { color: #f6393f; } .text-blue { color: #1c87bf; } .text-green { color: #95c91e; } .text-yellow { color: #ffb902; } .text-purple { color: #d32d93; } .point-red { background-color: #f6393f; } .point-blue { .........完整代码请登录后点击上方下载按钮下载查看
网友评论0