如何让我的标题在所有媒体上都能够响应？

我已经输入宽度：100％，但它不会回应任何事情。我如何让标题在所有浏览器和ipad，电话等上做出响应？如何让我的标题在所有媒体上都能够响应？

.head-wrap { 
background: url(http://envisionmediallc.com/prodigy/wp-content/uploads/2014/02/We-are-prodigy-dumbell-weight.jpg) top no-repeat; 
margin: 0; 
height: 480px; 
width: 100%; 
} 

.site-header { 
background: url(http://envisionmediallc.com/prodigy/wp-content/uploads/2014/02/Prodigy-Performance-we-are-prodigies4.png) no-repeat; 
margin: 0; 
width: 100%; 
height: 420px; 
} 

.site-header .wrap { 
padding: 16px 0; 
padding: 1rem 0; 
}

来源

2014-02-12 WsMom

你能告诉我们相关的CSS代码吗？ –

您应该发布代码，而不是链接。这样，如果网站发生故障，问题仍然与未来的SO用户有关。 –

在宽度上使用百分比使它们仅与已知父宽度相对。标题正在改变浏览器的大小，但不会缩小图像的大小。不确定你正在努力完成什么...... –

你可以尝试background-size风格头的设置100%;你可能会处理一些浏览器兼容性问题（在这里看到：https://developer.mozilla.org/en-US/docs/Web/CSS/background-size）

您也可以删除background-image财产，并填写内容用纯色img元素进行绝对定位，然后将这些img元素设置为宽度：100％;

你的div也被限制在420px的高度，这会让事情变得糟糕。设置的一个420PX最大高度，和经销商的height（在这里看到：https://developer.mozilla.org/en-US/docs/Web/CSS/max-height）

你可能不得不让你的两个背景重叠的背景图像相同的大小（因为尺寸不同，他们可能有不同的比率宽度/高度），并使用一些媒体查询来清理事情，尽管如此，使其工作100％。

来源

2014-02-12 23:08:09

如何让我的标题在所有媒体上都能够响应？

回答

相关问题