Fatal编程技术网

Twitter bootstrap 推特引导跨越

twitter-bootstrap

Twitter bootstrap 推特引导跨越,twitter-bootstrap,Twitter Bootstrap,我正在尝试使用NivoSlider作为我的图像滚动条，并希望将其放置在页面中心靠近顶部的一个div中，就在导航栏的下方（就像很多网站一样） 我想实现的是使其流动（已经是最大宽度100%，我知道），但是，当它填充父容器时，它在页面上看起来巨大，压倒一切 是否有一个跨度可以保持在页面的中心位置，或者如果我指定了Nivo包装的宽度和高度，我将如何保持这种流体。我似乎无法解决这个问题，如果有人能给我指出正确的方向，我将不胜感激 编辑确定，所以我创建了一个span2、span8、span2，并将nivos

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

我想实现的是使其流动（已经是最大宽度100%，我知道），但是，当它填充父容器时，它在页面上看起来巨大，压倒一切

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

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

为什么您决定不使用本机twitter引导滑块

也许这篇文章会帮助你：

你可以这样做，而不是你现在正在做的事情（它完成了同样的事情）

。
您可以这样做，以设置一个确切的宽度，而不是使用预设的跨css类

<div class="span12">

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

</div>


我的NIVO 100%宽度的东西
我想你想要的是nivo始终保持中心。按照网格系统的设置方式，您将使span12区域（页面中间940px）始终居中

所以无论你把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>


自举span12
我的nivo在这里
再次启动span12
我选择了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>