Twitter bootstrap 允许图像延伸到列外部

Twitter bootstrap 允许图像延伸到列外部,twitter-bootstrap,css,twitter-bootstrap-3,Twitter Bootstrap,Css,Twitter Bootstrap 3,我试图在Bootstrap3中完成一些事情。我有两列(宽度不等),我正试图使右侧列上的图像和左侧列上的图像一直通过(分别到达视口的右边缘和视口的左边缘)。如何做到这一点 我希望这两个图像都能一直延伸到屏幕上 我尝试过的事情: 1) 流体行和流体容器:但它们将整个视口划分为12列,这会打乱我的计算,即使是对于这个特定的行,所以我仍然希望使用容器和行 2) 负边际。但我不得不使用background:cover,因为图像并没有完全通过,但结果非常令人不快,因为它补偿了整个负边缘 我该怎么办 这就是

我试图在Bootstrap3中完成一些事情。我有两列(宽度不等),我正试图使右侧列上的图像和左侧列上的图像一直通过(分别到达视口的右边缘和视口的左边缘)。如何做到这一点

我希望这两个图像都能一直延伸到屏幕上

我尝试过的事情:

1) 流体行和流体容器:但它们将整个视口划分为12列,这会打乱我的计算,即使是对于这个特定的行,所以我仍然希望使用容器和行

2) 负边际。但我不得不使用
background:cover
,因为图像并没有完全通过,但结果非常令人不快,因为它补偿了整个负边缘

我该怎么办

这就是你的意思吗

。背景1{
背景图像:url('http://i.ytimg.com/vi/wMOpMka6PJI/maxresdefault.jpg');
宽度:100%;
高度:400px;
}
.背景2{
背景图像:url('http://www.usc.edu/dept/engineering/summerprograms/assets/001/75466.gif');
宽度:100%;
高度:400px;
}
.row.没有{
填充:0;
}

试验
试验
这就是你的意思吗

。背景1{
背景图像:url('http://i.ytimg.com/vi/wMOpMka6PJI/maxresdefault.jpg');
宽度:100%;
高度:400px;
}
.背景2{
背景图像:url('http://www.usc.edu/dept/engineering/summerprograms/assets/001/75466.gif');
宽度:100%;
高度:400px;
}
.row.没有{
填充:0;
}

试验
试验

我不希望弄乱正在使用的网格,而是将修改类应用于内部元素

.background1, .background2 {
    ...
    background-size: cover;
}
.edgy {
    margin: 0 -15px;
}

<div class="container-fluid">
    <div class="row">
        <div class="col-sm-4">
            <div class="background1 edgy">Test</div>
        </div>
        <div class="col-sm-8">
            <div class="background2 edgy">Test</div>
        </div>
    </div>
</div>
.background1、.background2{
...
背景尺寸:封面;
}
.急躁{
利润率:0-15px;
}
试验
试验

我不希望弄乱正在使用的网格,而是希望将修改类应用于内部图元

.background1, .background2 {
    ...
    background-size: cover;
}
.edgy {
    margin: 0 -15px;
}

<div class="container-fluid">
    <div class="row">
        <div class="col-sm-4">
            <div class="background1 edgy">Test</div>
        </div>
        <div class="col-sm-8">
            <div class="background2 edgy">Test</div>
        </div>
    </div>
</div>
.background1、.background2{
...
背景尺寸:封面;
}
.急躁{
利润率:0-15px;
}
试验
试验

否,如上所述,使用容器流体会弄乱我对该行的列计算。请参见第二张图片,需要从black div开始的位置开始。你明白我的意思吗?不,如上所述,使用容器流体会弄乱我对该行的列计算。请参见第二张图片,需要从black div开始的位置开始。你明白我的意思吗?不,如上所述,使用容器流体会弄乱我对该行的列计算。bootply.com/7OkBroYutm。请参见第二张图片,需要从black div开始的位置开始。你明白我的意思吗?我不知道你指的是什么“计算”,但你不应该为那一行使用容器。第二幅图像的起点基于容器列的起点。如果我使用容器流体,则第二个图像的起点会更早开始。不,如前所述,使用容器流体会打乱我对该行的列计算。bootply.com/7OkBroYutm。请参见第二张图片,需要从black div开始的位置开始。你明白我的意思吗?我不知道你指的是什么“计算”,但你不应该为那一行使用容器。第二幅图像的起点基于容器列的起点。如果使用容器流体,则第二个图像的起点会更早开始。