发表于: 2017-04-06 22:49:00

14 660


   老实讲,感觉这个任务对我来说还是比较吃力的,做到后面思维就开始混乱了,等一下这个样式,

等一下换那个样式,晕~,香菇。最终将师兄/姐的任务代码重新缕了一遍才勉强依葫芦画瓢做出来,知

道这样不好,但只有慢慢消化了。

一、今天完成的任务

  1、背景布局(task5-1)

     背景部分分为两部分,个人头像以及文字介绍。其中文字内容分为个人信息及地址内容。

      1)因为文字信息都在背景图片之上,图片以背景图显示

      2) 个人头像的圆形以 border-radius:50%表示

      3)文字内容以padding及margin值定位


  2、主体内容布局

      1)导航布局

        左边竖线以border表示

      2)内容布局

        内容以ul,li布局,样式相同的文字采用统一的选择器,以padding及margin值定位


  3、底部布局

      采用button标签,两个按钮样式大致相同,采用浮动布局


二、遇到的问题

  1、主要还是思维,思路不清晰;再加上还是缺乏耐心,像织毛衣一样,一定要静下心来

  2、另一个是各个部分的长宽及文字大小问题,因为要实现自适应使用百分值,只能估算


三、明日计划的事

    消化task5-1,完成task5-2


四、收获(学到的知识)

    background-size是css3中新增的属性,background-size的cover特定值会保持图像本身的宽

高比例,将图片缩放到正好完全覆盖定义背景的区域。



返回列表 返回列表
评论

    分享到