文章/答案/技术大牛

发布

社区首页 >问答首页 >响应图像图片媒体大小在firefox中不起作用

问响应图像图片媒体大小在firefox中不起作用
EN

Stack Overflow用户

提问于 2017-08-04 04:04:54

回答 1查看 78关注 0票数 0

style01

<figure>
        <picture>
          <source media="(min-width: 1200px)" srcset="./../../../assets/image/visual/main_visual01.jpg">
          <source media="(min-width: 992px)" srcset="./../../../assets/image/visual/main_visual01.jpg">
          <source media="(min-width: 768px)" srcset="./../../../assets/image/visual/main_visual01_m.jpg">
          <source media="(min-width: 320px)" srcset="./../../../assets/image/visual/main_visual01_m.jpg">
          <img src="./../../../assets/image/visual/main_visual01_m.jpg" class="visible-md visible-lg">
          <img src="./../../../assets/image/visual/main_visual01_m.jpg" class="visible-xs visible-sm">
        </picture>
        <figcaption class="blind">{{item.main_visual_desc}}</figcaption>
      </figure>

======================================================================

style02

<figure>
        <picture>
          <source media="(min-width: 1200px)" srcset="./../../../assets/image/visual/main_visual01.jpg">
          <source media="(min-width: 992px)" srcset="./../../../assets/image/visual/main_visual01.jpg">
          <source media="(min-width: 768px)" srcset="./../../../assets/image/visual/main_visual01_m.jpg">
          <source media="(min-width: 320px)" srcset="./../../../assets/image/visual/main_visual01_m.jpg">
          <img src="./../../../assets/image/visual/main_visual01_m.jpg" style="width:auto">
        </picture>
        <figcaption class="blind">{{item.main_visual_desc}}</figcaption>
      </figure>

=======================================================================

我的页眉

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>팝스애플 공방</title>
  <base href="/">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="./assets/css/app.component.compact.css">
  <link rel="icon" type="image/x-icon" href="popsapple_favicon.ico" />
  <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.3/Chart.bundle.min.js"></script>
</head>

它可以在Chrome上运行，但不能在Firefox上运行。

javascript

html

css

回答 1

Stack Overflow用户

发布于 2017-08-04 04:19:31

Bootstrap有一个很好的class，它可以自动将你的图像渲染为响应式图像。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/45493630

复制

相似问题

问响应图像图片媒体大小在firefox中不起作用
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问响应图像图片媒体大小在firefox中不起作用EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问响应图像图片媒体大小在firefox中不起作用
EN