web 前端 如何分享到instagram_Web前端基础：常见的移动web问题、各种bug坑如何解决...

Web前端基础,前端开发教程

web的本意是蜘蛛网和网的意思，在网页设计中我们称为网页的意思。现广泛译作网络、互联网等技术领域。表现为三种形式，即超文本(hypertext)、超媒体(hypermedia)、超文本传输协议(HTTP)等。

常见的移动web问题，终端触摸交互，各种bug坑如何解决？

移动web最佳viewport设置

单行文本溢出

　　.inaline{

　　overflow:hidden;

　　white-space:nowrap;

　　text-overflow:ellipsis;

　　}

多行文本溢出

　　.intwoline{

　　display:-webkit-box!important;

　　overflow:hidden;

　　text-overflow:ellipsis;

　　word-break:break-all;

　　-webkit-box-orient:vertical;

　　-webkit-line-clamp:2;

　　}

移动端click事件响应慢300ms以及tap点头的bug：

解决方案：使用fastclick库(听说最新版zepto已经解决这个bug)

touch事件：

安卓机只会触发一次touchstart，一次touchmove，不会触发touchend、

解决方案：在touchmove中加event.preventDefault();

注意：会导致默认行为不触发，比如scroll，滚动失效

弹性滚动：是一种缓冲反弹的效果，改善用户体验

body层滚动：自带弹性滚动，overflow:hidden失效，gif和定时器暂停

局部滚动：没有弹性滚动，没有滚动惯性，不流畅

解决：局部滚动开启弹性滚动

　　body{

　　overflow:scroll;

　　-webkit-overflow-scrolling:touch;

　　}

安卓不支持原生的弹性滚动，需要使用第三方库，如：iScroll

下拉刷新的实现：顶端下拉一段距离，页面弹性滚动向下

上拉加载的实现：使用scroll事件，而不是touch事件(安卓机有bug)

网页，是网站中的一「页」，通常是HTML格式(文件扩展名为.html或.htm或.asp或.aspx或.php或.jsp等)。网页通常用图像档来提供图画，网页要透过网页浏览器来阅读。

网页是构成网站的基本元素，是承载各种网站应用的平台。简单的说，网站就是由网页组成的，多个网页页面组成网站整体。如果只有域名和虚拟主机而没有制作任何网页的话，用户无法访问网站，更无法了解企业信息。

以上是酷仔今日整理的“Web前端基础：常见的移动web问题、各种bug坑如何解决”一文，希望为正在学习Web前端的同学提供学习参考。