发表于: 2019-12-18 22:02:23

1 1741


完成的事

1,基本完成初步设计框架;

2,对boostrap官方文档的正式学习;

3,更新了以前对于boostrap的认知,明白使用该框架开发的好处;

明天计划的事

1,在首页初步设计的框架上的基础上添加样式;

2,对boostrap组件的学习;

遇到的问题

1,一开始没有仔细阅读官方文档,引用了错误的的boostrap库文件,导致一些问题,后来按照官方文档指南引入无误后解决问题;

收获

一,对企业官网的初步设计;

  •  1,明确要求:使用boostrap进行自适应设计:

      颜色获取:header/footer:#29b078,body:#fafafa;

  1.       顶部信息栏:需要媒体查询前显示联系电话和qq,微信,微博小图标;媒体查询后显示登陆注册;
  2.       header设计:四个可跳转字面,有hover下划线效果,并且在页面变小时出现隐藏导航栏图标(可展开)
  3.       轮播图设计:从ps获得轮播图片,使用boostrap官网指南进行设计;
  4.       主体页面:主要分为五块;
         (1) 好处说明块(#afafaf): 4小块,最后一块左边有虚线隔开的效果,各分三列;
  5.      (2)如何学习块(#999999):一共两行,共八个小块,每个分配三列,       

     (3)学员展示页块:有类似卡片的效果,可给每个学员卡片外增加合适右外边距,设置左浮动;

              修正:效果是需要将学员介绍进行轮播展示。因此需要新的设计;

     (4)战略合作企业块:共五个,每个企业图标有hover阴影效果;

     (5)友情链接块:共2行,每行十个;

         footer设计:技能书块分配3列,旗下网站块分配6列,二维码块分配3列;

         footer底下加上版权标识;                                        


返回列表 返回列表
评论

    分享到