1.css问题
1.1兼容性
（1）flex布局兼容性
display: -webkit-box; /* mate8 支持 */
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
align-items: center;
（2）css3兼容：animation transform transition keyframes
-webkit-
（3）iphone X 兼容
@media only screen and (device-width: 375px) and (device-height: 812px) and
(-webkit-device-pixel-ratio: 3) {
//css 注意层级 实在不行加！important
}
1.2 其他问题
（1）复制粘贴
html,body{
-moz-user-select: none; /*火狐*/
-webkit-user-select: none; /*webkit浏览器*/
-ms-user-select: none; /*IE10*/
-khtml-user-select: none; /*早期浏览器*/
user-select: none;
}
（2）高度（父元素min-height,子元素：height：100%；无效）
1.给子元素绝对定位，但这样会使得子元素脱流，如果子元素的高度超过父元素高度的时候，父子元素不会呈现一致高度。
css代码
.container{
min-height:0.6rem;
position:relative;
}
.text{
height：100%；
position:absolute;
}
html代码
<div class="container">
<div class="text">
</div>
</div>
2.给子元素加min-height属性
css代码
.container{
min-height:0.6rem;
}
.text{
height：100%；
min-height:0.6rem;
}
（3）垂直水平居中
position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
(4) ios点击闪现透明框
html,body{
-webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
}
2.vue问题
（1）v-cloak:防止在变量确定前出现乱码
&[v-cloak] {
display: none!important;
}
（2）v-if与v-show
v-if 不渲染元素
v-show 会将元素置为 display：none;
所以，v-show在弱网情况下容易出现元素重叠
（3）v-for渲染对象与渲染数组
for...in...遍历对象无序，如果想按顺序渲染，可以把对象转化为数组
思路：用Object.keys(obj)取出来对象的所有键值，遍历键值数组，取到对应value值，push进新数组。
var subjectInfo = []；
var info = {"exerciseId":739857,"lessonId":50228,"tid":279074733,"exerciseType":27"}；
var infoKey = Object.keys(info).sort() || [];
for ( var m = 0, length = infoKey.length; m < length; m++ ){
info[infoKey[m]].tid = infoKey[m];
subjectInfo.push(info[infoKey[m]]);
}
3.fis问题
（1）__inline图片
