css干货满满：https://lhammer.cn/You-need-t...1.一行css文字超出...`overflow:hidden;text-溢出：省略号；空白：nowrap；`2。多行文字超出显示...`display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;`3.IOS手机容器滚动条做滑动不流畅`overflow:auto;-webkit-overflow-scrolling:touch;`4.修改滚动条样式，隐藏div元素的滚动条`div::-webkit-scrollbar{display:none;}`div::-webkit-scrollbar滚动条的全部部分div::-webkit-scrollbar-thumb滚动条里面的小框，可以上下移动（或者从左到右，取决于垂直滚动条）还是水平滚动条的轨道div::-webkit-scrollbar-track(the滚动条轨道两端的按钮都配备了Thumbdiv::-webkit-scrollbar-button，可以通过点击div::-webkit-scrollbar-track-piece来微调小框的位置。内轨道，滚动条的中间部分（去掉div::-webkit-scrollbar-corner角，这是两个滚动条div::-webkit-resizer的交点两个滚动条交点上的小控件用于通过拖动来调整元素的大小，注意这个方案存在兼容性问题，一般需要隐藏滚动条的时候，我都是通过定位用色块覆盖，或者增加子元素的大小,父级元素使用overflow-hidden截断了滚动条部分。暴力而直接。5、用css写一个三角形的角标元素，宽高设置为0，通过border属性设置，使其他三个方向的边框颜色透明或背景色保持不变，以及剩余边框的颜色设置为所需的颜色。`div{宽度：0；高度：0；边框：5pxsolid#transparent；border-top-color:red;}`6.解决ios音频无法自动播放或循环播放的问题。ios手机在使用音频或视频播放时，个别机型无法实现自动播放，可以使用如下代码hack。`//解决ios音频无法自动播放或循环播放的问题varmusic=document.getElementById('video');varstate=0;document.addEventListener('touchstart',function(){if(state==0){music.play();state=1;}},false);document.addEventListener("WeixinJSBridgeReady",function(){music.play();},false);//循环music.onended=function(){音乐.load();music.play();}`7.水平和垂直居中我一般只用positioning或者flex两种方式，我觉得够用了。`div{宽度：100px；高度：100px；位置：绝对；顶部：0；右：0；底部：0；左：0；保证金：自动；;证明内容：居中；对齐项目：居中；}`8。隐藏页面元素display-none：元素不存在，去掉dom中的opacity-0：元素透明度会是0，但是元素依然存在，绑定的事件依然有效，依然可以触发执行。visibility-hidden：元素隐藏，但元素仍然存在，页面上无法触发该元素的事件。9.前端工程说到前端工程，很多人会想到webpack，这是错误的。webpack只是前端工程的一部分。在整个工程过程中，他帮助我们解决了大部分问题，但不是全部。前端工程是一种通过工具来提高效率和降低成本的手段。近年来，受到广泛关注和讨论。主要原因是现代前端应用的功能需求不断提高，业务逻辑也越来越复杂。前端作为当前互联网时代唯一不可或缺的技术，可以说是占据了整个开发行业。半个国家。从传统网站到H5、手机APP、桌面APP、小程序。前端技术几乎无所不能全面覆盖。这些表象的背后，其实是行业对开发者的要求发生了翻天覆地的变化。以往在前端编写demo、设置模板、调整页面的刀耕火种方式已经完全不能满足现在对开发效率的要求。前端工程就是在这样的背景下被摆上台面，成为前端工程师必备的手段之一。一般来说，前端工程包括项目初始化、项目开发、集成、构建、打包、测试、部署等过程。工程就是从工程的角度去解决这些问题。比如我们一般使用npminit进行项目初始化，plop创建页面模板。我们喜欢用ES6+开发，但是需要通过babel编码成ES5。我们使用git进行持续集成，但是为了保持开发标准，我们引入了ESLint，一般用于部署。ci/cd或者jenkins等。前端工程是一个比较大的话题，后面会单独讨论。10、contenteditablehtml中的大部分标签是不可编辑的，但是添加contenteditable属性后，标签会变成可编辑的。`
