【问题标题】:Responsive, TypeScript响应式,TypeScript
【发布时间】:2019-03-25 21:17:17
【问题描述】:

我想返回一个屏幕响应,只有显示加载图像的部分。 我该如何更改它,因为在我的代码中我输入了一个 [height] 和一个 [width] 来给它们一个度量,但是我希望它们能够自动调整,如果这是在 CSS 中完成的?

【问题讨论】:

    标签: angular typescript responsive


    【解决方案1】:

    您可以使用 bootstrap col 或使用媒体查询做出响应 如果可以重写你的 html 代码并添加 col 会很好

      <div class="row">
          <div *ngIf="" class="col-sm-12>
        /* .... */
          </div>
       </div>
    

    或者使用媒体查询

      @media only screen and (min-width: 1024px),
    only screen and (min-device-width: 1024px) and (orientation:portrait),
    only screen and (min-device-width: 1024px) and (orientation:landscape) {
      #gallery {
        width: 50% !important;
        min-height: 300px;
      }
    }
    
    @media only screen and (min-width: 450px) and (max-width: 1023px) and (orientation: landscape) {
    
      #gallery {
        min-height: 400px;
        // max-height: 50% !important;
      }
      }
    
      @media (max-width: 450px) {
     #gallery {
        // max-height: 50% !important;
        // width 
      }
      }
    

    【讨论】:

    • 非常感谢,我只用“%”的高宽解决了
    • 太棒了!所以请按照回答回答:) @AnfonyLagunaAv
    猜你喜欢
    • 2021-02-21
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-06-19
    • 2021-05-05
    • 2020-03-05
    • 2019-05-12
    相关资源
    最近更新 更多