桌面上的标题，但移动设备上的全屏宽度标题

Question

我在容器中有一个简单的Bootstrap 3站点，因此整个内容以左右自动边距为中心。

在移动设备上，我需要标题以获取背景颜色的屏幕的整个宽度，但标题（徽标，导航）的内容需要与其他所有内容垂直对齐，例如页面内容。

我的结构是：

.container
    header.row
        .logo.col-md-8
        .navigation.col-md-8
    /header.row
    .row
        .content.col-md-16
    /.row
    ...
/.container

Answer 1

如果您希望标题为全宽，那么您必须将其移出容器类并应用一个自定义类，将其置于较大的屏幕中，并在较小的屏幕上为100％。使用媒体查询。