w活用border
<!doctype html> <html> <head> </head> <body> <div style="margin: 2em;"> <div style="position: absolute;border-left:0.2em solid black;height: 2em;"></div> <div style="position: relative;;border-bottom:0.1em solid black;top:2em;"></div> <div style="position: absolute;left: 1.5em;;top:0.8em;">08:00</div> <div style="position: absolute;left: 8em;border-left:0.1em dashed black;height: 1em;top:3em;"></div> <div style="position: absolute;left: 14em;border-left:0.2em solid black;height: 2em;"></div> <div style="position: absolute;left: 13.0em;;top:0.8em;">09:00</div> </div> </body> </html>
<!doctype html> <html> <head> </head> <body> <div style="margin: 2em;"> <div style="position: relative;border-left:0.2em solid black;height: 2em;;border-bottom:0.1em solid black;"></div> <div style="position: relative;left: -1.0em;;top:-3.2em;">08:00</div> <div style="position: relative;left: 4em;border-left:0.1em dashed black;height: 1em;top:-2.4em;"></div> <div style="position: relative;left: 8em;border-left:0.2em solid black;height: 2em;top:-4.3em;"></div> <div style="position: relative;left: 7.0em;;top:-7.3em;">09:00</div> </div> </body> </html>
原文：http://www.cnblogs.com/yuanjiangw/p/6430167.html