Question

在网站getbootstrap.com/css上，页面顶部有一个紫色横幅。

这是否已通过任何引导程序组件实现？

我能看到的最接近的是＆＃34;面板＆＃34; http://getbootstrap.com/components/#panels

我想做一个类似的布局，但我是bootstrap的新手，现在是100％的。

Answer 1

试试这个：

CSS：

 @media (min-width: 768px) {
            .bs-docs-masthead {
                padding: 80px 0;
            }
        }

        .bs-docs-masthead, .bs-docs-header {
            position: relative;
            padding: 30px 15px;
            color: #cdbfe3;
            text-align: center;
            text-shadow: 0 1px 0 rgba(0,0,0,.1);
            background-color: #6f5499;
            background-image: -webkit-gradient(linear,left top,left bottom,from(#563d7c),to(#6f5499));
            background-image: -webkit-linear-gradient(top,#563d7c 0,#6f5499 100%);
            background-image: -o-linear-gradient(top,#563d7c 0,#6f5499 100%);
            background-image: linear-gradient(to bottom,#563d7c 0,#6f5499 100%);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#563d7c', endColorstr='#6F5499', GradientType=0);
            background-repeat: repeat-x;
        }

HTML：

 <div class="bs-docs-masthead" id="content" role="main">
            <div class="container">
                Your Data
            </div>
        </div>

如何实现getbootsrap.com/css紫色横幅

1 个答案: