美文网首页
小白都会的网页排版

小白都会的网页排版

作者: matthrew | 来源:发表于2017-09-14 19:01 被阅读138次

    网页排版的三要素:对齐成组字体

    对齐

    为什么要对齐?(ask me)

    元素对齐之后,其对齐的一边就像被一根线穿连在了一起,一提起线,就能把所有东西拎走。也好像是有一笔直的墙撑起所有,给人安全感。

    对齐的一般做法是什么?

    1. 单个页面的对齐方式一般不超过两种

    2. 对齐方式的顺序:先左对齐,如果有第二种对齐方式,可以选择居中对齐,切勿直接调到右对齐。不可以先居中对齐,再左对齐。一定是从左往右,或者是从右往左

    成组

    设置组是为了将相似或者相同属性的元素聚在一起,避免信息散乱。如同将房间内的物品归类整理之后,房间变得整齐一样。

    怎么做?

    1. 间距:相同属性的元素之间的间距假设设置为10px,那么不相同属性之间的元素间距就要设置为其2倍。也可以用回车来区分,单个回车代表一级间距,两个回车代表元素之间层级不同

    2. 聚集:将相同属性的元素靠近安放

    字体

    字体的大小、形状、颜色可以表达出不同的意思。最大的字体,往往代表最高层级,加粗的字体,代表用户想要突出此文本,等等。

    颜色在同一个页面最好不要超过三种色系。


    举例

    对齐

    左对齐

    成组

    成组

    字体

    字体

    注意事项

    1. 不要使用斜体

    2. 使用列表时,如果出现类似「姓名:xxx」的格式,「姓名」和「:」必须加粗

    3. 避免使用太多gif

    4. 避免使用不规则图案

    相关文章

      网友评论

          本文标题:小白都会的网页排版

          本文链接:https://www.haomeiwen.com/subject/tbgdsxtx.html