CSS&JS一些问题

1. 实现div横向排列，元素往两边撑， 中间自动撑开空格。在父元素里设置

  display: flex;
  justify-content: space-between;// 元素两边撑， 中间空格
  flex-wrap: wrap;  //自动换行

2. 背景图片自适应div

  background-image: url('https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1534338303259&di=32ea50cea87d2a19800734392896ec96&imgtype=0&src=http%3A%2F%2Fi.shangc.net%2F2018%2F0628%2F20180628094600404.jpg');
  background-size:contain;
  background-repeat: no-repeat;
  -moz-background-size: 100% 100%;
  background-size: 100% 100%;

背景图片自适应

  background-size: cover;
  -webkit-background-size: cover;
  -o-background-size: cover;

3. text-overflow:ellipsis 文字超出省略号代替不起作用解决方法

    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: break-all;

原文档http://yunkus.com/text-overflow-ellipsis-do-not-work/

4. rich-text 如果使用了不受信任的HTML节点，该节点及其所有子节点将会被移除,比如<font></font>

5. CSS苹方字体
   https://www.jianshu.com/p/bc9f57a645bd

6. 小程序v-html解析html标签，以及对文本format操作

//html
    <div class="content">
      <div v-html="body"></div>
    </div>
//js
this.body = this.body.replace(/<img/g, '<img style="height: 100%;width: 100%;margin-bottom: 33rpx;"')
.replace(/<p/g, '<p style="margin-bottom: 15rpx"')
.replace(/src="\//g, 'src="' + DOMAIN + '/')

7. <scroll-view>隐藏滚动条

  ::-webkit-scrollbar{
    width: 0;
    height: 0;
    color: transparent;
  }

8、vue阻止点击事件冒泡

<div v-if="item.status == 'On'" class="downline" @click.stop="isPublish(item.nid, item.sid, '0', index)"><trans labelKey="btn_offline"/></div>

参考网址：https://blog.csdn.net/iceking66/article/details/78246626

9、es6 new set去重

this.originalScript = Array.from(new Set(this.originalScript))

参考网址：https://blog.csdn.net/u012830533/article/details/73551104