Question

有一个名为SPAM的网站我正在尝试使用js，jquery和一些css创建此网站的同一主页。

现在，问题是如何根据中心的框修复图像大小。如何创建最佳用户体验，就好像SPAM一样。

您可以通过查看SPAM的不同网站来体验分辨率或探索者的小窗口和大窗口大小。

我该怎么办？有关SPAM的最佳用户体验的答案和代码帮助或建议？

Answer 1

这是flash ...但你可以用一些jQuery做同样的事情：

HTML：

<div id="container"></div>

的CSS：

#container {
    min-width: 500px;
    width: 100%;
    height: 100%;
    position: relative
    background: url('path') 0 0 no-repeat;
}

jQuery的：

$(window).bind("resize", function() {
    var $winwidth = $(window).width(); //specify some padding here
    $("#container").attr({
        width: $winwidth
    });
});

Answer 2

首先，让<did id='main'>获取屏幕宽度

#main { width:100% }

然后，里面的图像应该有类似的样式：

#main img { width:100% }

请注意，未设置图像高度，以使其以正确的比例自动缩放。

这应该有助于获得类似于上述网站的效果。

Answer 3

您可以使用

margin: 0 auto;

在内部元素上，因此它是水平对齐的。

如何根据其嵌套框来塑造图像大小

3 个答案: