zoukankan      html  css  js  c++  java
  • css总结

    1.图片居中,通过固定图片高度 

    #settings .item > img{ position:absolute; right:13px; top: 50%; margin-top: -6px;/*图片高度的-1/2 */ }

      

     2. 多行省略

    /*html代码*/
    <h2>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et.</h2>
    /*css代码*/
    $font-size: 26px; $line-height: 1.4; $lines-to-show: 3; h2
    { display: block; /* Fallback for non-webkit */ display: -webkit-box; max-width: 400px; height: $font-size*$line-height*$lines-to-show; /* Fallback for non-webkit */ margin: 0 auto; font-size: $font-size; line-height: $line-height; -webkit-line-clamp: $lines-to-show; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }

    3. 移动端基本css

      

    /* 快速滚动和回弹效果 */
    -moz-overflow-scrolling: touch;
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
    
    /* 字体设置 */
    font-family: Helvetica,Arial, SimHei, '微软雅黑', Helvetica;
    font-size:13px;

     4.禁止点击元素: 可通过设置 pointer-events: none;来禁止,非常好用。

     5. css转换大小写: text-transform:lowercase/uppercase

  • 相关阅读:
    NC105 二分查找
    Spark-Streaming总结
    spark java API 实现二次排序
    在eclipse上安装Scala插件
    maven:missing artifact jdk.tools:jar:1.7
    使用 Hive装载数据的几种方式
    Eclipse debug 调试快捷键
    yarn工作流程
    Windows 7 下安装mysql-5.7.18-winx64.zip
    希尔排序
  • 原文地址:https://www.cnblogs.com/lifeisshort/p/4840700.html
Copyright © 2011-2022 走看看