使用样式遇到背景图像问题

时间:2017-07-04 10:11:31

标签: css html5

在Mac Os上使用css的背景图像有问题。 如果我们改变浏览器的分辨率,它看起来很糟糕。我需要在每个resol和Mac OS上看起来都一样。

有2个部分有bg图像

使用Mac os

http://i.imgur.com/UmGGBA4.jpg

使用window os

https://i.imgur.com/QjXNxag.jpg

我希望看起来像MAC上的窗口os图像。



.section-about {
    background: url("http://i.imgur.com/NlczAVu.jpg") top right/cover no-repeat;
    min-height: 545px;
  }

  /* line 180, ../sass/screen.scss */
  .section-experinece {
    background: url("http://i.imgur.com/eAeB5ci.jpg") top right/cover no-repeat;
    min-height: 1130px;
  }
  
  h1 {
  margin: 0;
  }
  
  .one {
  color: #fff;
    margin: 0;
  }
  
  p {
      margin: 0;

  }

<section id="about" class="section-about">
    <h1>section1</h1>
                        <p clas="one">Lorem ipsum doeqw sitqwewqe amet, consectetur adipiscing elit. Phasellus porta massa sit amet magna luctus euismod. Maurn malesuada nunc.  <span class="bold">Lorem ipsum dolor sit amet.</span></p>
 <p clas="one">Lorem ipsum doeqw sitqwewqe amet, consectetur adipiscing elit. Phasellus porta massa sit amet magna luctus euismod. Maurn malesuada nunc.  <span class="bold">Lorem ipsum dolor sit amet.</span></p>
</section>

<section id="experinece" class="experinece-sec section-experinece">
    <h1>section2</h1>
             <p>Lorem ipsum doeqw sitqwewqe amet, consectetur adipiscing elit. Phasellus porta massa sit amet magna luctus euismod. Maurn malesuada nunc.  <span class="bold">Lorem ipsum dolor sit amet.</span></p>
                      <p>Lorem ipsum doeqw sitqwewqe amet, consectetur adipiscing elit. Phasellus porta massa sit amet magna luctus euismod. Maurn malesuada nunc.  <span class="bold">Lorem ipsum dolor sit amet.</span></p>
</section>
&#13;
&#13;
&#13;

感谢。

1 个答案:

答案 0 :(得分:0)

看起来您的问题不是您所使用的操作系统,而是您正在查看的屏幕分辨率。

检查Windows机器上的页面,尽可能宽地查看视图。

Viewed on windows, in IE