废话不多说

Demo

高度完全的自适应

中心思想是table

和第二列行高的50%的上下绝对定位竖线

第一次用codepen less完全不能用啊 连node png之类的都是关键词会被去掉。。。

马克一个介绍Codepen简介

我总在想无论是画画还是写代码

思考这个东西的本身的结构组成原理（无论是时间轴还是人体）

比照着葫芦画瓢或者死记硬背一些东西重要的多

嗯！

私心表达一下，桐谷健太赛高~\(≧▽≦)/~

[原创]一个纯css实现兼容各种主流移动pc浏览器的时间轴的更多相关文章

  1. 一个纯CSS DIV天气动画图标【转扒的】

    <p> </p> <style><!-- /* SUNNY */ .sunny { -webkit-animation: sunny 15s linear i ...

  2. 大神写的一个纯CSS圆角框，膜拜！（支持IE9一下的低版本）

    留着提醒自己,底层才是最重要的,不要一直傻瓜的编程下去! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...

  3. 手把手教你打造一个纯CSS图标库

    来,干了这碗安利 写这篇文章的目的其实就是为了安利一下我的图标库:iconoo,所以,开门见山,star吧少年少妇们!(这样的我是不是应该要加个github互粉的团伙了?) 主题说完了,下面进入正题. ...

  4. 一个标签的72变，打造一个纯CSS图标库

    每次要用到图标的时候都会到 icono 去copypaste,但每次用到的时候尺寸都各不一样,总是要调整参数,巨烦.当然你可以会想到用zoom.scale来做缩放,但是这样的缩放会使得线宽也变粗了,不 ...

  5. 【原创】纯CSS画黄金梅丽号！

    代码如下 <!DOCTYPE html> <!-- saved from url=(0055)http://jadyoap.bj.bcebos.com/ife%2FcssCatAni ...

  6. 一个纯CSS实现的卡片翻转效果

    先上代码 <div id="box"> <div class="front">正面</div> <div class= ...

  7. 分享一个纯css制作的动画化，在网页（手机）载入等的时候能够引用！

    CSS代码例如以下: /* Custom Stylesheet */ body, html { margin: 0; -webkit-font-smoothing: antialiased; back ...

  8. 原创：纯CSS美化单复选框（checkbox、radio）

    最重要的一点,隐藏选择框本身.不多说了,上代码: <!doctype html> <html> <head> <meta charset="utf- ...

  9. 纯CSS的颜色渐变效果

    本例展示了一个纯css渐变的效果.其兼容IE6以上浏览器等各主流浏览器: 案例效果:查看演示 代码如下: css: *{margin:0;padding:0;} .linear{ width:100% ...

随机推荐

  1. 设置lable文本内容的行间距

    NSMutableParagraphStyle *paragraphStyle =[ [NSMutableParagraphStyle alloc] init]; paragraphStyle.lin ...

  2. Loadrunner：集合点（Rendezvous）

    集合点:等到特定的用户数后再一起执行某个操作,比如一起登录.一起发信,一般情况下使用不到集合点,不过,订票系统或者促销类需要用到,比如说某个促销品的促销时间在8点到8点30,这样的话,就可能出现在8点 ...

  3. 九度OJ 1544 数字序列区间最小值

    题目地址:http://ac.jobdu.com/problem.php?pid=1544 题目描述: 给定一个数字序列,查询任意给定区间内数字的最小值. 输入: 输入包含多组测试用例,每组测试用例的 ...

  4. 使用HTML5构建下一代的Web Form

    HTML语言作为如今编程最为广泛的语言,具有易用.快捷.多浏览平台兼容等特点,但是随着时代的进步,HTML的标准却停滞不前,这一次还在不断开发中的[color=#444444 !important]H ...

  5. CTest

    一.初识CTest CTest是CMake集成的一个测试工具,在使用CMakeLists.txt文件编译工程的时候,CTest会自动configure.build.test和展现测试结果 CTest有 ...

  6. centos下网络的基本配置方法讲解

    上一篇中我们已经成功安装了我们的centos系统,但是我们可能发现我们安装的centos上不了网,所以这一章我们来说说如何配置centos来连接外网和局域网. 我们首先来认识一下linux下部分网络配 ...

  7. 【PHP】金额数字转换成大写形式

    <?php /*将数字金额转成大写*/ function num_to_upper($num) { $d = array('零','壹','贰','叁','肆','伍','陆','柒','捌', ...

  8. Case When Exists SQL

    The Case-When-Exists expression in Oracle is really handy. Here's an example of how to use it in a s ...

  9. Check Box Select/Deselect All on Grid

    The below function is to be used on a grid with multiple check boxes. Place the code behind a FieldC ...

  10. [leetcode]_Climbing Stairs

    我敢保证这道题是在今早蹲厕所的时候突然冒出的解法.第一次接触DP题,我好伟大啊啊啊~ 题目:一个N阶的梯子,一次能够走1步或者2步,问有多少种走法. 解法:原始DP问题. 思路: 1.if N == ...