边框和线条美工设计的5个技巧

作者:     目录: CSS+HTML     发表: 2010年07月31日

网页设计越来越注重前端设计,特别是网页美工,我觉得像我这种美工功底比较差的站长和博主不再少数,所以特意搜集整理了一些边框和线条设计的技巧和示例。

1. 边框圆角

直角看时间长了容易产生审美疲劳,可以试试边框圆角,可以直接使用 CSS3Border Radius 属性制作边框圆角。

2. 不规则多边形和折线

边框和线条设计

边框和线条美工设计

3. 边框阴影

边框和线条美工设计的5个技巧

增加阴影能产生层次感,可以使用 CSS3Box Shadow 属性制作边框阴影效果。

4. Beveled

边框和线条美工设计的5个技巧

增加立体感

5. 分割线

边框和线条美工设计的5个技巧

这才是真的分割线,看起来就像是被刀片划了一道一样。

总结:美工设计是考验耐力的事情,像我种搞编程的人来说,实在是种折磨,但这从另一个方面也反映出自己的懒惰,就算是美工基础不是好,但是只要耐住性子也能设计出优秀的作品。