全宽.col- in .container＆gt; 。行

Question

有没有办法在bootstrap页面上创建一个.col，以便它一直到它的容器边缘？

我希望示例中的图像（在.container中的.row内的.col-xs-12中）用尽所有空间直到容器的边缘。我可以用纯JS根据需要调整它来解决这个问题，但我更愿意使用纯CSS方法解决这个问题（如果可能的话）。就像现在一样，我已经尝试了几种不同的负边距和相对定位的变体，但所有这些变量都不会与边缘完全对齐或者混淆其他东西。

以下是页面编码方式的基本示例：https://www.bootply.com/wVw5jnKa35

Answer 1

如果您想要达到自己的要求，可以在col-xs-12班级

中添加自定义班级

喜欢这个

<强> HTML

<div class="col-xs-12 no-pad">
   <img class="FullWidth" src="http://calendar.volego.ru/img/users/wallpapers/20160215081029217.jpg">
</div>

<强> CSS

.no-pad {
   padding: 0;
}

Answer 2

您不需要为此目的定义和使用自定义类。 简单地说，在第8行，改变：

<div class="col-xs-12">

到

<div>