kie*_*kie 3 background-image css3
我有点陷入一些新的CSS3背景命令,想知道是否有人可以提供建议？
我正在尝试创建一个具有可动态缩放到屏幕/浏览器大小的背景图像.
这是我想要实现的效果的一个示例,它运行在<body>标签http://www.css3.info/demos/background-size-contain.html
我遇到的问题是<body>标签不需要高度或宽度定义,但<div>确实,这是我的代码:
<!DOCTYPE html>
<html>
<head>
<title>background-size: contain;</title>
<style type="text/css">
#please_expand {
background-image: url(images/betweengrassandsky.png);
background-repeat: no-repeat;
background-attachment: fixed;
background-color: #EEE;
background-size: contain;
}
</style>
<body>
<div id="please_expand">
<h1>Example J - background-size: contain;</h1>
</div>
</body>
</html>
在块元素(如div)上,高度与宽度的工作方式不同.如果未指定高度,则元素将与其内容一样高.这是一回事.
height: 100%如果你想让你的div变得那么大,那将body是你要走的路,但诀窍是百分比高度总是来自父母的身高.所以你必须height: 100%在所有父母(包括html)上设置crosss-browser结果.
html,body,#please_expand { height: 100%; }