Skip to main content

12 posts tagged with "css"

View All Tags

ios中safari浏览器100vh带有滚动条？

· One min read

问题场景​

在移动端safari或者chrome浏览器中，使用100vh，会出现滚动条。

根本原因​

在safari和chrome浏览器中，100vh是指去掉地址栏的高度，所以会出现滚动条。

解决方案​

移动端一般不考虑chrome浏览器，用户基数小，如果只考虑微信公众号开发也不用考虑这个问题。如果需要考虑safari浏览器的用户体验，建议使用100%替代100vh，或者使用js，而不是100vh

关于 Safari 100vh 的问题与解决方案 - 掘金 (juejin.cn)

文本溢出加省略号

· One min read

单行文本溢出

     p{
      width: 100%;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

多行文本溢出

    p{
      width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp:3;
      -webkit-box-orient:vertical;
    }