0

我正在尝试将 NivoSlider 用于我的图像滚动器，并希望将其放置在靠近顶部的页面中心的 div 中，就在导航栏下方（就像很多网站一样）。

我想要实现的是让它变得流畅（我知道最大宽度已经是 100%），但是当它填充父容器时，它在页面上看起来很大并且压倒了一切。

是否有我可以使用的跨度将保持在页面的中心，或者如果我指定 Nivo 包装器的宽度和高度，我将如何保持这种流体。我似乎无法解决，如果有人能指出我正确的方向，将不胜感激

编辑好的，所以我创建了一个 span2、span8、span2 并将 nivoslider 放在 span8 中，现在这已使滑块居中，但我猜有更好的方法

4

2 回答 2

1

你可以这样做而不是你目前正在做的事情（它完成同样的事情）......

<div class="span8 offset2"></div>.

您可以这样做来设置精确的宽度，而不是使用预设的跨度 css 类...

<div class="span12">

    <div style="width: MY_EXACT_WIDTH_IN_PIXELS; margin: 0 auto;">
        MY NIVO THINGY WITH 100% WIDTH
    </div>

</div>

我认为您想要的是让 nivo 始终保持居中。网格系统的设置方式，您将让 span12 区域（页面的中间 940 像素）始终居中。

所以无论你把 nivo 放在哪里，你都想结束所有的引导标签......

这是一个例子......

<html>
<head>
    <title></title>
    <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="js/bootstrap.min.js" type="text/javascript"></script>
</head>
<body>
        <div class="container">
            <div class="row">
                <div class="span12" style="background-color: #CCC;">
                    <h4>Bootstrap span12</h4>
                </div>
            </div>
        </div>

        <div style="margin: 0 auto; width: 400px; background-color: #EFEFEF;">
            <h4>My nivo goes here</h4>
        </div>

        <div class="container">
            <div class="row">
                <div class="span12" style="background-color: #CCC;">
                    <h4>Bootstrap span12 again</h4>
                </div>
            </div>
        </div>
</body>
</html>
于 2012-06-25T16:17:02.273 回答
0

为什么你决定不使用原生 twitter 引导滑块？

也许这篇文章会对您有所帮助：使 nivo 滑块变得流畅

于 2012-06-25T12:31:39.897 回答