zoukankan      html  css  js  c++  java
  • 图片的css自适应

    当需要css来缩放图片的时候,可以采用外层容器100%或者任意百分比,

    内层图片img tag 没有宽高,用sass写经过断点后的mixin中的样式就是这样:

    .workscon_section{  100%;
        .left_art{ 
              100%; display: block; float: left; text-align: center;
             img{ border: 0 none; height: auto; max- 92%; margin: 1px 0; 
            }
         }
     }     

    如果断点的宽度比图片的最大尺寸还大的话,会出现不能居中。

    比如手机的horizontal portrait 就会很难看。

    这种时候css可能没法办到,还是需要js来控制外层容器的宽度,然后margin:0 auto;

    _workscon_section = ($(window).width()-50)>600?600:($(window).width()-50);        

    比如图片最宽是600px,小于600的时候用窗口宽度来计算。

    在超过600的时候,就应该还是600,否则就不会居中了。

  • 相关阅读:
    CTF SQL注入知识点
    Rot13加密算法
    LFU缓存
    Redability
    快排
    更新卡片的zIndex
    webshell文件下载器
    [转]背包九讲
    hihocoder第196周
    Python import容易犯的一个错误
  • 原文地址:https://www.cnblogs.com/haimingpro/p/3845372.html
Copyright © 2011-2022 走看看