发表于: 2017-07-24 23:31:25

1 865


今天完成的任务:

今天改了一些样式上的问题,第一个是富文本编辑器,之前会时不时的出现滚动条的情况,直接给了一个min-height强制高度。

新增页按钮自适应做的不好,右浮动之后出现宽度变窄的问题,通过修改了bs样式解决了


杨大佬看了代码,我的代码有很多问题,耦合太严重,有些地方没办法优化,很多写法也不够正规。我尽量把能修改的地方都按照项目规范来。


封装了过滤器模块,配合常量使用,很简单方便。


明天计划的事情:

开复盘评审


遇到的问题:

暂无


收获:

小课堂

1.背景介绍

随着智能手机的迅速发展,大众群体使用手机访问互联网的频率已经超过了使用pc端的频率。面对这样的一个大趋势和潮流,许多传统的pc厂商和互联网企业都在争抢其中的红利,自然,传统的只能在pc端显示的网页,如何适应这个潮流,也成了人们开始关注和解决的问题。于是响应式布局的概念就被提出来了,响应式布局是

2.知识剖析

什么是响应式布局?

2.1响应式布局

响应式布局可以为不同终端的用户提供更加舒适的界面和更好的用户体验,而且随着目前大屏幕移动设备的普及,用“大势所趋”来形容也不为过。随着越来越多的设计师采用这个技术,我们不仅看到很多的创新,还看到了一些成形的模式。

2.2响应式布局的优点

第一点,在分辨率不同,设备环境进行一些不同的设计,对于小企业而言,所有开发维护和运营上,相对多个版本成本会降低很多。

第二点,兼容性好,跨平台,移动设备尺寸参差不齐,版本定制通常只适用于固定规格的设备,但不适用分辨率变化较大的设备,响应式布局能够较好的解决这个问题。

2.3响应式布局的缺点

第一点,移动端和PC端页面加载的内容是一样的,代码多了,会出现隐藏无用的元素,加载时间加长导致文件增大,影响加载速度,流量消耗也相对比较大。

第二点,局限性,对于响应式,局限性较大,不适合一些大型的门户网或者电商网站,一般门户网或电商网站一个界面内容较多,而响应式最忌讳较多内容,代码过多会影响运行速度。

第三点,一定程度上改变了网站原有的布局结构,会出现用户混淆的情况。

第四点,对于响应式Web设计,为搜索引擎确定关键字不是一件容易的事。用户在不同终端的搜索习惯不同,移动用户多采用不同的关键字,而搜素引擎对移动网站和电脑网站的关键词处理策略也不相同。不利于搜索引擎的关键词优化。

第五点,如果计划把一个现有网站转化成响应式网站,可能耗时更多。如果你想要一个响应式网站,最好从草图开始重新设计。

3.常见问题

问题:如何实现响应式布局?

4.解决方案

方法:第一种,使用诸如来自Twitter的bootstrap框架,Foundation等比较流行的能够实现响应式的

第二种,要看公司的体量和要求了。如果前端大牛很多,自己搞一套响应式的框架或者组件直接使用也不是不可能。

第三种,具体而言,就是合理使用媒体查询的功能,这也是实现响应式布局的主要手段。网页的基本单位不能是固定单位,使用百分比、em、rem、vw、vh等(弹性布局和流体布局)。

5.编码实战

6.扩展思考

问题:自适应网页好做还是响应式网页好做?

7.参考文献

参考一:百度百科

参考二:

参考三:

参考四:

8.更多讨论

讨论点:除了使用媒体查询,还有什么方法可以实现让网页随屏幕变化的功能?

鸣谢

感谢大家观看


返回列表 返回列表
评论

    分享到