响应式web，这玩意有谁开发过实战项目吗？
我前端做了有十多年了，响应式技术大概2010年出现的，我在这方面案例我经手大概有1000多个。
也正是基于这么多项目，我一直想整理一套快速前端开发框架，我也开发过不少响应式框架，不过近期的这个是我个人最满意的，它是kuapingUI跨屏ui框架
简单介绍一下
它不是一个再造的css框架，几乎没有学习成本，它是基于bootstrap的基础之上开发的大组件框架，比如新闻列表来说，就提供了十几种风格供你选择，非常的方便。
响应式布局
响应式网站主要针对于UI, UE级。响应式顾名思义是Html页面( web为主)可以针对不同设备的不同分辨率做出不同风格得展示形式。比如: PC屏幕分辨率常见的从1366* 768 - 1920*1080，平板，手机这些都有各自的屏幕分辨率。如果同一页面元素布局不做适配就会严重影响用户体验; 故此响应式布局便是主要解决这些问题。接下来我们讲一下具体响应式是如何做到响应的。
响应式布局原理
响应式布局它内部是依据流式布局和自适应布局相结合。这些都是网页端常见的布局种类，那么什么是流式布局还有什么是自适应布局？
- 流式布局
依据 css 的 float(浮动属性)，就好比砌墙一样，一行一行的垒砖头。它可以自动的帮你把这些元素堆叠在一起。但是，如果容器宽高变化导致一行容不下子元素，那么子元素会自动排在下一行，然后页面布局就会错乱，这也是它的弊端。
- 自适应布局
依据 css3 的媒体查询 (media)，它可以针对不同的分辨率(自行设定) 来展示不同的样式。这样的话就可以弥补流式布局的缺陷，但是它只是强制更改 css 属性使元素达到目的，总得来说延展性不好(需要写很多适配代码)。但这本身并不是它的缺陷，因为它关注的是适配不同设备的分辨率。
- 响应式布局(栅格)
结合前两种，便出现了响应式的布局，这样既能够自动的排列元素，并且可以自动适应不同的容器。将元素按照屏幕分辨率的百分比分成若干份( bootstrap为12，element为24，ant design为 24)，然后浮动子元素让其填充容器，配合着媒体查询，将容器的宽度进行自动的更换，然后为不容宽度的容器改变其展示(交互方式)。这就是响应式原理，当然里面还有很多细节，在这就不展开细说。总之，响应式布局是目前主流的布局方式。我们接下来说下其代表:
- bootstrap
以 jquery 为主导的 ui 框架，当然现在也有( vue, react)版。当时几乎各类网站都以它为参考标准进行设计和实现。
当然还有什么 layui, yui, mui等等。
- element UI
以 vue 为主导的UI组件库，目前也是vue项目的主力军，框架也很稳定，当然还有iview 等，而且现在也有针对 react 版本的。
- ant design
以 react 为主导的，里面封装了各类组件库，也有针对企业级的管理组建库也非常值得学习。同样，它也有针对 vue 版本。
总得来说，在jquery为主的时代，bootstrap那时候就是业界标准，但是目前前端框架迭代速度之快，mvvm 的迭代更新进而UI组建也不断地更新迭代，但总得来说都是为了适应业务快速迭代而产出的各类产品。
最后，响应式 web 的原理及相应的组件已经介绍完了，需要了解和掌握其中的机制才能应对现在的各类业务的扩展。
响应式网站，目前市面上模板很多，主打的还是h5，开发起来全是自适应，对于PHP出身的我，骨子里还是很难适应自适应，好比让一个裁缝制作一件男女老少都能穿的橡胶衣服一样，习惯问题。但随着电子设备的多重多样，你不得不主动去适应市场。
所以，比较常用的构架是dede或者thinkphp，这样改起来更加高效，目前市面上模板也多，当然了，你要有一定的规避版权的能力。
一个非常好的问题。响应式Web设计是一种页面设计布局，理念是“让人们忘记设备尺寸”，可以智能地根据用户行为以及使用的设备环境进行相对应的布局调整。
一，特点
1，能够以可变尺寸显示网页
2，动态适应平板和移动设备
二，常用框架
1，Bootstrap
Bootstrap是流行的开发响应式 web 的 HTML, CSS, 和 JS 框架,由两个Twitter员工开发并开源，在Github上非常火爆，在国内也有很多粉丝。
2，UIKit
UIkit 是一个轻量级、模块化的前端框架，可快速构建强大的web前端界面，根据不同的屏幕分辨率与上网设备，会自动做出响应，提供一致的体验。
3，Ivory
Ivory是一款强大、灵活、易用的响应式框架。Ivory基于12列的响应式网格布局，包含表格，按钮，表格，分页，拨动开关，工具提示，手风琴，选项卡等网站中常用的组件和样式。
三，Ant Design实例
在开发Web服务脚手架时，后台管理系统基于Ant Design Pro开发。
视频加载中...
Ant Design Pro 是一个企业级中后台前端/设计解决方案，提供了丰富的模板、业务组件和配套设计资源，基于React开发，可以快速搭建企业级中后台产品原型。
1，脚手架模板
2，超大尺寸布局，4列
3，大尺寸布局，2列
4，常规尺寸布局，抽屉式菜单栏
5，小尺寸布局，浮动式菜单栏
6，超小尺寸布局，单列
我是工作多年的Web应用架构师，陆续发布关于软件开发方面的文章，欢迎关注我，了解更多IT专业知识。
一个合格的web前端需要掌握哪些技术？
谢邀，我来分享作为BAT的web工程师看到的，一个合格的web前端需要掌握哪些技术。
三驾马车
最基础的自然是JavaScript，HTML和css这三种语言。
首先了解下它们到底是什么。
HTML是用户看到的网页的骨架，比如你会发现当前页面分为左中右三个部分，其中还填充了不同的文字和图片；每个子部分还会继续细分，比如当前页面的中间部分下方有输入框等等。
CSS是网页展示的细节控制，比如你会发现有的文字是红底白色，有的子部分占了页面的二分之一宽，有的只占六分之一，有些部分需要用户进行某些操作（如点击，滑动）才会出现等等，这些就是有CSS来控制。
JavaScript是负责捕捉用户在浏览器上的操作，并与后端服务器进行数据交换的脚本语言。当用户在前端进行点击，输入等操作的时候，会触动绑定了该动作的JavaScript脚本，然后JavaScript收集数据，调用后端的api接口，再将后端返回的数据交给HTML和CSS渲染出来。
一个网页的HTML代码和CSS代码是可以直接在浏览器中查看的，你可以直接按F12，就能看到下图右侧的模块，左右侧红框就是代码与实际页面的对应关系。因此如果你看到某个网站的布局很不错，不妨点击F12，进行学习。
前端框架
然而，实际应用中，已经很少有正规的项目组直接用上述三种语言进行web 前端开发了，而是使用很多封装了这三种语言的框架，比如
Vue.js
，angular，react native等等。它们是来自谷歌和Facebook的大神项目组，基于自己的经验，封装了原生前端语言，实现了更多更复杂更酷炫的功能。因此，可以说，学会使用这些框架，能达到事半功倍的效果。比如用了vue，它是自底向上增量开发的设计，其核心只关心图层，而且还可以与其他库或已存项目融合，学习门槛极其友好；另一方面，vue可以驱动单文件组件和vue生态系统支持的库开发的复杂单页应用。有了这个生态系统，可以说，vue是处在一个不断壮大，不断完善的欣欣向荣的状态。
网络通信协议
由于前后端分离的趋势，前端还需要了解很多网络通信协议的知识，这里不局限于http协议，因为据我的经验，有时候我们还会用到websocket等协议。因此，前端需要简单了解不同协议的特点以及使用方式，但是好消息是不用像学习计算机网络课程一样对每种协议的原理都了解的特别透彻，只要学会如何用前端语言发送这种协议的请求就够了。
以上，如果对你有帮助，欢迎点赞或者留言~
我是苏苏思量，来自BAT的Java开发工程师，每日分享科技类见闻，欢迎关注我，与我共同进步。
前端是近期逐渐火起来的一个职业，目前呢前端的划分比较的宽泛，写页面算前端，做全站的也可以算前端，也是五花八门，要啥有啥。这里说下各个阶段你的前端你需要掌握什么知识。
1、初级前端
掌握HTML、CSS、JS、jQuery基础，能够熟练的运用完成静态页面的制作以及页面中轮播图、弹出层、瀑布流、楼层导航、固定导航等特效的制作。
2、中级前端
掌握HTML5、CSS3、移动基础、ajax、bootstrap、less、vue等框架以及技术，能够熟练的完成网页交互处理，前台页面的渲染，优化网页动画设计，提高网站的性能，快速搭建交互式网页。
3、高级前端
全栈工程师，从前端语言的开发到后台程序的编写无不精通，具有独立完成整个项目制作的能力。整个公司的核心领队人物。