美文网首页
移动端CSS3

移动端CSS3

作者: 老白儿 | 来源:发表于2016-12-05 21:15 被阅读21次

1.滚动属性

.fullScreen-scroll{
  overflow-x:scroll; 
  //height:100%;  
  -webkit-overflow-scrolling: touch;
  
}

2.css3多行超出隐藏

width: 100%;
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 7;
-webkit-box-orient: vertical;

3.背景毛玻璃 嗨皮效果

.blur{
    -moz-filter: blur(10px);
    -webkit-filter: blur(10px);
    -o-filter: blur(10px);
    -ms-filter: blur(10px);
    filter: blur(10px);
}

清除移动端浏览器点击时候的边框

-webkit-tap-highlight-color: transparent;

移动端禁止文字选中(auto 设置为长按选中状态)

.row-of-icons {
-webkit-user-select: none; /* Chrome all / Safari all */
-moz-user-select: none; /* Firefox all */
-ms-user-select: none; /* IE 10+ */</p> <p> /* No support for these yet, use at own risk */
-o-user-select: none;
user-select: none; 
}

常用文字设置

例1(小米米官网):font-family: "Arial","Microsoft YaHei","黑体","宋体",sans-serif;

例2(淘宝技术研发中心):font: 12px/1.5 Tahoma,Helvetica,Arial,'宋体',sans-serif;

例3(加网 ):font: 14px/1.5 'Microsoft YaHei',arial,tahoma,\5b8b\4f53,sans-serif;

例4(淘宝UED):font: 12px/1 Tahoma,Helvetica,Arial,"\5b8b\4f53",sans-serif;

例5(一淘UX):font-family: Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', '微软雅黑', Arial, sans-serif;

font: 12px/1 Tahoma,Helvetica,Arial,"\5b8b\4f53",sans-serif;

相关文章

  • 11、CSS3新特性 新增选择器 、伪元素选择器及应用场景(浮

    CSS3新特性 CSS3 的现状 新增的CSS3特性有兼容性问题,ie9+才支持 移动端支持优于 PC 端 不断改...

  • 简单的CSS3 心跳动画

    之前做了半年的移动端,现在又转战PC端。我是深知移动端的美好。。。这里简单的介绍一下CSS3的Animation ...

  • 10-CSS3新特性

    CSS3简介 CSS3的现状 浏览器支持程度差,需要添加 私有前缀 ; 移动端支持优于PC端; 不断改进中; 应用...

  • 移动端

    移动端开发和 PC 端开发有哪些区别 移动端 考虑手机兼容性 使用触屏事件 布局自适应rem 动画处理CSS3 移...

  • 三十九、CSS3的新特性(上)

    一、CSS3的新特性 1.1、CSS的现状 新增的CSS3特性有兼容性问题,ie9+才支持。 移动端支持优于PC端...

  • 2019-08-12 js题

    移动端和PC端有什么区别 PC考虑的是浏览器的兼容性,而移动端开发考虑的更多的是手机兼容性、 CSS3的动画在移动...

  • 移动端CSS3

    1.滚动属性 2.css3多行超出隐藏 3.背景毛玻璃 嗨皮效果 清除移动端浏览器点击时候的边框 移动端禁止文字选...

  • CSS知识

    CSS3资料员 http://tympanus.net/codrops/css_reference 解决移动端边框...

  • CSS3笔记

    一、CSS3属性选择器 什么是 CSS3在 CSS2 的基础上拓展、新增的样式 CSS3 发展现状移动端支持优于 ...

  • css3动画响应式适配问题

    在做css3动画的时候,我们经常遇到需要适配移动端和pc端的问题,比如UI给了一个两倍的缓动图片序列,因为在移动端...

网友评论

      本文标题:移动端CSS3

      本文链接:https://www.haomeiwen.com/subject/nejlmttx.html