文章/答案/技术大牛

发布

社区首页 >问答首页 >在相同的12列网格中对齐巨型加速器图像

问在相同的12列网格中对齐巨型加速器图像
EN

Stack Overflow用户

提问于 2016-02-21 02:22:08

回答 1查看 255关注 0票数 0

一周前，我刚开始学习HTML和CSS，并且一直在使用coursera和codeacademy进行学习。我想做一个简单的网站使用引导，在顶部有一个导航条，和一个大封面图片在下面。

代码如下所示。

<body>
    <header class="container">
        <div class="logo"> <!--this is where the logo resides-->
            <div class="row">  <!--making a row for header elements-->

                <figure class="col-xs-7">
                    <a href="/"> </a> 
                </figure>

                <div class="col-xs-5" > <!--adds the 3 buttons on top right-->
                    <button type="button">
                        <em class="cogs"> </em>
                    </button>

                    <button type="button">
                        <em class="cogs"> </em>
                    </button>

                    <button type="button">
                        <em class="cogs"> </em>
                    </button>

                </div>
            </div>
        </div>                

        </div>

    </header>

    <div class="jumbotron">
        <div class="row">
            <figure class="col-xs-12"> </figure> <!--cover pic-->

        </div>
    </div>

</body>
</html>

当我打开浏览器中的html (带有样式表)时，我会得到附加的图像。在这里输入图像描述。我认为封面图片将自动对齐在12列网格下方的导航条在顶部，裁剪出来的边。我的问题是: 1.在12个网格系统中添加一个图像不是自动的吗? 2.如何将3个图标推到导航栏的右侧(即列的右边)？

多谢一堆人！我很感谢事先有任何建议或建议。

html

css

twitter-bootstrap

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-02-21 05:25:01

我认为巨型加速器类是特意格式化的，以达到页面的边缘。

如果我正确地理解了您的问题，因为您不希望将巨型加速器扩展到屏幕的边缘，那么您可能希望将巨型加速器放置在div class=“容器”中，作为W3CSchools建议。

引导v3之所以整洁，是因为它已经创建了像导航杆这样的工具。您可以尝试使用使用"< nav >“标记和无序列表，如下所示：

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/35531557

复制

相似问题

问在相同的12列网格中对齐巨型加速器图像
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在相同的12列网格中对齐巨型加速器图像EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在相同的12列网格中对齐巨型加速器图像
EN