html css

HTML <style> scoped 属性

scoped 属性是一个布尔属性。

如果使用该属性，则样式仅仅应用到 style 元素的父元素及其子元素。

<style scoped>
</style>

单行文字超出省略号

text-overflow:ellipsis;   //表示文本超出用省略号代替
white-space:nowrap;   //表示文本不换行；
overflow:hidden;     //表示超出隐藏；

多行文字超出省略号

display: -webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient: vertical;
overflow: hidden;

vue >>> /deep/

vue引用了第三方组件，需要在组件中局部修改第三方组件的样式，而又不想去除scoped属性造成组件之间的样式污染。此时只能通过>>>，穿透scoped。

有些Sass 之类的预处理器无法正确解析 >>>。可以使用 /deep/ 操作符( >>> 的别名)

<style scoped>

  外层 >>> 第三方组件 {
      样式
  }

/deep/  第三方组件 {
      样式
  }
</style>