如何在浏览器窗口重新调整大小时调整网页大小？

-1

在我的网站这是在背景图片幻灯片放映工作。但我需要为身体也一样。谁能帮我？如何在浏览器窗口重新调整大小时调整网页大小？

.cb-slideshow li span { 
    width: 100%; 
    height: 100%; 
    position: absolute; 
    top: 0px; 
    left: 0px; 
    color: transparent; 
    background-size: cover; 
    background-position: 50% 50%; 
    background-repeat: none; 
    opacity: 0; 
    z-index: 0; 
    -webkit-backface-visibility: hidden; 
    -webkit-animation: imageAnimation 36s linear infinite 0s; 
    -moz-animation: imageAnimation 36s linear infinite 0s; 
    -o-animation: imageAnimation 36s linear infinite 0s; 
    -ms-animation: imageAnimation 36s linear infinite 0s; 
    animation: imageAnimation 36s linear infinite 0s; 
}

来源

2013-03-27 Anju

我不敢说我不知道你在找什么。你能澄清你需要什么吗？ – DACrosby 2013-03-27 06:40:29

如果要调整您的页面时，浏览器窗口大小的变化，你可以使用媒体查询（仅限现代浏览器都支持这一点） - 或者你可以选择使用JavaScript（第三个选项是两个）。然而你的问题表明你想避免JavaScript。我在下面用媒体查询做了一个例子。当您的屏幕尺寸在800像素到1000像素之间时，将应用CSS。你可以将这些陈述结合起来，比如只用min或max就可以了。

@media all and (max-width: 1000px) and (min-width: 800px) { 
    .cb-slideshow li span { 
    /* css here*/ 
    } 
}

您可以使用媒体查询更改任何元素。它通常用于创建响应式设计。

来源

2013-03-27 06:45:11

Hi Xeano？我试过了。但没有工作。我想知道我该如何在JavaScript中编写此代码？谢谢 – Anju 2013-03-27 08:39:46

你应该可以使用媒体查询。你正在使用哪种浏览器？这里有一个小指南，如果它不适合你。它最后一次帮助了我。 http://stackoverflow.com/questions/7859336/css3-media-queries-not-working – 2013-03-27 08:49:13

仍然无法正常工作。使用Firefox。我不想在浏览器更改时更改设备宽度。当我最小化网页我需要身体也应该尽量减少（所有的内容在身上）。我想我应该使用它的Java脚本。你有什么想法吗？ – Anju 2013-03-27 10:55:27

如果你正在寻找如何设置你的身体，即使它没有足够的内容窗口范围内，尽量

html, body{ 
    width: 100%; 
    height: 100% 
}

来源

2013-03-27 06:46:13

可以使用一种叫做响应式设计。它使用媒体查询根据屏幕分辨率进行调整。只需在任何流行的搜索引擎中搜索响应式设计，就会从链接中学到很多东西。

现在您可以将此样式添加到您的身体

body { 
    width: 100%; 
    height: 100%; 
}

这将使它的身体反应。

来源

2013-03-27 06:55:54 KrazzyProgrammer

简单的例子，只是添加到您的页面，并在页面低于960像素的整个身体就会消失

@media screen and(max-width:960px){ 
    body{ 
     display:none; 
    } 
}

现在您可以添加，以适应各种尺寸的需要发生了许多变化

来源

2013-03-27 06:59:18 iConnor

如何在浏览器窗口重新调整大小时调整网页大小？

回答

相关问题