css小tips

像我们平时做的显示在页面上的多行纯文字，很有可能会出现两端不齐的现象，如图1。

图1 两端不对齐

这里推荐使用text-align:justify来做两端对齐的布局。如图2。

图2 两端对齐

类似这种竖向文字排版如图3、图4，可以使用-webkit-writing-mode: vertical-lr; writing-mode: vertical-lr;来使它竖直排版。

图3 竖直效果 图4 竖直效果 图5 渐变边框 图6 非渐变边框

本次活动页要求写一个渐变边框，如图5所示，这里推荐使用css3的线性渐变linear-gradient。代码如下：

图7 渐变边框代码

transition与visibility可以用来做延时显示，代码如下：

图7 延时代码