HTML+CSS打造简单的横向时间轴

最新推荐文章于 2024-05-08 15:03:49 发布

出道晚了

最新推荐文章于 2024-05-08 15:03:49 发布

阅读量8.8k

点赞数 3

分类专栏： WEB前端文章标签： WEB前端时间轴

本文链接：https://blog.csdn.net/rockjun7788/article/details/48545829

版权

大哥尽头需要一个时间轴，好吧找遍了各个模版觉得他们的功能过于复杂，看来还是需要自己手动敲。代码如下 .time{ width: 740px; } .time ul{ list-style-type: none; background-image: url(../ui/p

摘要由CSDN通过智能技术生成

大哥尽头需要一个时间轴，好吧找遍了各个模版觉得他们的功能过于复杂，看来还是需要自己手动敲。

代码如下

<!DOCTYPE html>
<html>
  <head>
    <meta content="text/html; charset=gbk" http-equiv="content-type">
    <title></title>
    <style type="text/css">
      .time{
        width: 740px;
      }
      .time ul{
        list-style-type: none;
        background-image: url(../ui/purduct-nav/timeline-bg.png);
        background-repeat: repeat-x;
        height: 10px;
        position:relative;
          top: 10px;
      }
      .timeline li{
      float: left;
      width: 110px;
      background-image: url(../ui/purduct-nav/timeline-arrowgray.png);
      background-repeat: no-repeat;
      position:relative;
        top:-4px;
        left: 30px; 
      }
      li .pront-text{
      position:relative;
        top:-20px;
        left: -25px;
      font-size: 16px;
      font-family: arial, Arial, Ta

最低0.47元/天解锁文章

出道晚了

关注

3
点赞
踩
9

收藏

觉得还不错? 一键收藏
0
评论
HTML+CSS打造简单的横向时间轴

大哥尽头需要一个时间轴，好吧找遍了各个模版觉得他们的功能过于复杂，看来还是需要自己手动敲。代码如下 .time{ width: 740px; } .time ul{ list-style-type: none; background-image: url(../ui/p
复制链接

扫一扫