css背景图像（和动画）

我快发疯了，因为旁边有两张图片..在我用Firefox（17英寸fhd）的屏幕上，一切看起来都很完美（用IE来代替是错误的），但我试了一个旧的（不是fhd）17英寸的屏幕，它们看起来很糟糕..我把另一台17英寸的pc连接到了一台42英寸的电脑上电视和它的稍微好一点，但仍然不能接受。我应该做什么，让他们在每一个屏幕漂亮和固定？媒体查询

我想要它的方式（以及我在使用Firefox的pc上看到它的方式）

我如何看待它与其他pc（以及在我的pc中，但与IE）

在link，您可以在浏览器上试用

有缺陷的显示左侧较大，在右侧边缘切割。右侧屏幕更小、更短（不包括从上到下的屏幕）

这就是我现在掌握的密码

#contenitore {
  position: fixed;
  height: 100%;
  width: 100%;
  top: 0px;
  left:0px;
  background-image: url(img/cl_at_small.jpg);
  background-size: contain;/*2000px 950px;
  background-repeat: repeat-x;*/
  z-index: -9999;
  -webkit-animation: animatedBackground 40s infinite;
  -moz-animation: animatedBackground 40s infinite;
  animation: animatedBackground 40s infinite;   
  -webkit-animation-timing-function: linear; /* Chrome, Safari, Opera */
  -moz-animation-timing-function: linear;
  animation-timing-function: linear;
}

#imL{
  background-image: url(img/AT_X.jpg);
  background-size:cover;
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  background-repeat:no-repeat;
  width: 10%;
  z-index: 9999;
}

#imR{
  position: fixed;
  right: -1px;
  top: 0;
  background-image: url(img/anno2015.jpg);
  background-size:contain;
  height: 100%;
  background-repeat:no-repeat;
  width: 10%;
  z-index: 9999;
}

@-moz-keyframes animatedBackground {
  0% {
    background-position: 0px 0px; }

  100% {
    background-position: -1400px 0px; } 
}

@-moz-keyframes animatedBackground {
  0% {
    background-position: 0px 0px; }

  100% {
    background-position: -1400px 0px; } 
}

@-webkit-keyframes animatedBackground {
  0% {
    background-position: 0px 0px; }

  100% {
    background-position: -1400px 0px; } 
}

@-webkit-keyframes animatedBackground {
  0% {
    background-position: 0px 0px; }

  100% {
    background-position: -1400px 0px; } 
}

---

谢谢

如果指定最小高度或将当前高度分类更改为px高度而不是%height，该怎么办。

如果指定最小高度或将当前高度分类更改为px高度而不是%height，该怎么办。

您使用了

背景尺寸：contain；“

将其更改为

背景尺寸：封面；“

用于

#imR

试试这个

#imR {
      position: fixed;
      right: 0px;
      top: 0;
      background-image: url(img/anno2015.jpg);
      background-size: cover; //changed this
      height: 100%;
      background-repeat: no-repeat;
      width: 10%;
      z-index: 9999;
    }

您使用了

“背景大小：contain；“

将此更改为

”背景尺寸：封面；“

用于

#imR

试试这个

#imR {
      position: fixed;
      right: 0px;
      top: 0;
      background-image: url(img/anno2015.jpg);
      background-size: cover; //changed this
      height: 100%;
      background-repeat: no-repeat;
      width: 10%;
      z-index: 9999;
    }

---

我想你可能只是在你的css中有一个混乱：在你想要的行为方式的图像中，你有

background-size: cover;  

在右图中，您有：

background-size: contain;

---

将正确的图像切换到“cover”至少会使它们的行为相同。

我认为您的css中可能有一个混乱：在以您想要的方式表现的图像中，您有

background-size: cover;  

在右图中，您有：

background-size: contain;

将正确的图像切换到“封面”至少会使它们的行为相同。

使用“背景尺寸：封面；“用于左侧图像，但”背景大小：包含；对于右边的图片，你使用“背景尺寸：封面；“用于左侧图像，但”背景大小：包含；“对于右边的图像？