blocks|key|5224419|text|你不能仅仅添加一个边框到跨度，因为它会破坏布局，因为宽度的计算方式是:宽度=边框%2B填充%2B宽度。由于容器是940px，跨度是940px，添加2px边框(总共4px+)将使其看起来偏离中心。解决办法是更改宽度以包含4px边框(原始-+4px)，或者在内部使用另一个div来创建2px边框。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5224420|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

<p>You can't just add a border to the span because it will break the layout because of the way width is calculate: width = border + padding + width. Since the container is 940px and the span is 940px, adding 2px border (so 4px altogether) will make it look off centered. The work around is to change the width to include the 4px border (original - 4px) or have another div inside that creates the 2px border.</p>


blocks|key|5224456|text|CSS中有一个名为box-sizing.的属性，它决定了页面上元素的总宽度。默认值是content-box，它不包括元素的填充、边距或边框。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|5224457|因此，如果你设置了一个div来填充width:+500px和20px，它将占用你网站上的540px+(500+%2B+20+%2B+20)。|5224458|这就是导致您的问题的原因。Bootstrap就像上面的例子一样计算集合宽度，这些东西没有边界。由于Bootstrap像拼图一样拼凑在一起，因此在其中一条边添加边框将产生501px的总宽度(继续上面的例子)，并破坏您的布局。|5224459|解决这个问题最简单的方法是调整你的box-sizing。您将使用的值是box-sizing:+border-box。这包括box元素中的填充和边框。You+can+read+more+about+box-sizing+here.|5224460|这个解决方案的一个问题是它只适用于IE8%2B。因此，如果你需要更深入的IE支持，你需要覆盖Bootstrap宽度来考虑你的边框。|5224461|为了给出一个如何计算新宽度的示例，首先检查Bootstrap在元素上设置的宽度。假设它是一个span6，宽度为320px+(这纯粹是假设的，span6的实际宽度将取决于您特定的Bootstrap配置)。如果您想要在右侧添加一个边框，在那里填充20px，那么您可以在样式表中编写以下CSS|5224462|.span6+{
++padding-right:+20px;
++border-right:+1px+solid+#ddd;
++width:+299px;
+}|code-block|syntax|javascript|5224463|其中，新宽度的计算公式为：|5224464|old+width+-+padding+-+border|5224465|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/CSS/box-sizing^0|9|B|16|B|0|B|3|H|C|U|4|18|5|0|0|H|A|Z|M|22|14|0|0|0|1A|5|1J|5|0|0|0|0|S|0^^$0|@$1|2|3|4|5|6|7|16|8|@$9|17|A|18|B|C]|$9|19|A|1A|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|1B|8|@$9|1C|A|1D|B|C]|$9|1E|A|1F|B|C]|$9|1G|A|1H|B|C]|$9|1I|A|1J|B|C]]|D|@]|E|$]]|$1|H|3|I|5|6|7|1K|8|@]|D|@]|E|$]]|$1|J|3|K|5|6|7|1L|8|@$9|1M|A|1N|B|C]|$9|1O|A|1P|B|C]]|D|@$9|1Q|A|1R|1|1S]]|E|$]]|$1|L|3|M|5|6|7|1T|8|@]|D|@]|E|$]]|$1|N|3|O|5|6|7|1U|8|@$9|1V|A|1W|B|C]|$9|1X|A|1Y|B|C]]|D|@]|E|$]]|$1|P|3|Q|5|R|7|1Z|8|@]|D|@]|E|$S|T]]|$1|U|3|V|5|6|7|20|8|@]|D|@]|E|$]]|$1|W|3|X|5|6|7|21|8|@$9|22|A|23|B|C]]|D|@]|E|$]]|$1|Y|3|-4|5|6|7|24|8|@]|D|@]|E|$]]]|Z|$10|$5|11|12|13|E|$14|15]]]]

<p>There's a property in CSS called <code>box-sizing.</code> It determines the total width of an element on your page. The default value is <code>content-box</code>, which doesn't include the padding, margin, or border of the element.</p>

<p>Hence, if you set a <code>div</code> to have <code>width: 500px</code> and <code>20px</code> padding all around, it will take up <code>540px</code> on your website (500 + 20 + 20).</p>

<p>This is what is causing your problem. Bootstrap calculates set widths for things just like the above example, and these things don't have borders. Since Bootstrap fits together like a puzzle, adding a border to one of the sides would yield a total width of 501px (continuing the above example) and break your layout.</p>

<p>The easiest way to fix this is to adjust your <code>box-sizing</code>. The value you would use is <code>box-sizing: border-box</code>. This includes the padding <em>and</em> border in your box elements. <a href="https://developer.mozilla.org/en-US/docs/CSS/box-sizing" rel="noreferrer">You can read more about box-sizing here.</a></p>

<p>A problem with this solution is that it only works on IE8+. Consequently, if you need deeper IE support you'll need to override the Bootstrap widths to account for your border.</p>

<p>To give an example of how to calculate a new width, begin by checking the width that Bootstrap sets on your element. Let's say it's a <code>span6</code> and has a width of <code>320px</code> (this is purely hypothetical, the actual width of your span6 will depend on your specific configuration of Bootstrap). If you wanted to add a single border on the right hand side with a 20px padding over there, you'd write this CSS in your stylesheet</p>

<pre><code>.span6 {
  padding-right: 20px;
  border-right: 1px solid #ddd;
  width: 299px;
 }
</code></pre>

<p>where the new width is calculated by:</p>

<p><code>old width - padding - border</code></p>


blocks|key|5224488|text|虽然这可能不是正确的方法，但我发现一种简单的变通办法是简单地使用框阴影而不是边框……这不会破坏网格系统。例如，在您的示例中：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5224489|HTML|offset|length|style|BOLD|5224490|<div+class="container">
++++<div+class="row"+>
++++++++<div+class="span12">
++++++++++++<div+class="row">
++++++++++++++++<div+class="span4">
++++++++++++++++++++1
++++++++++++++++</div>
++++++++++++++++<div+class="span4">
++++++++++++++++++++2
++++++++++++++++</div>
++++++++++++++++<div+class="span4">
++++++++++++++++++++3
++++++++++++++++</div>
++++++++++++</div>
++++++++</div>
++++</div>
</div>|code-block|syntax|javascript|5224491|CSS|5224492|.span12{
++++-moz-box-shadow:+0+0+2px+black;
++++-webkit-box-shadow:+0+0+2px+black;
++++box-shadow:+0+0+2px+black;
}|5224493|Fiddle|5224494|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/77Udx/1/^0|0|0|4|0|0|0|3|0|0|0|6|0|0^^$0|@$1|2|3|4|5|6|7|10|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|11|8|@$D|12|E|13|F|G]]|9|@]|A|$]]|$1|H|3|I|5|J|7|14|8|@]|9|@]|A|$K|L]]|$1|M|3|N|5|6|7|15|8|@$D|16|E|17|F|G]]|9|@]|A|$]]|$1|O|3|P|5|J|7|18|8|@]|9|@]|A|$K|L]]|$1|Q|3|R|5|6|7|19|8|@]|9|@$D|1A|E|1B|1|1C]]|A|$]]|$1|S|3|-4|5|6|7|1D|8|@]|9|@]|A|$]]]|T|$U|$5|V|W|X|A|$Y|Z]]]]

<p>While it's probably not the <em>correct</em> way to do it, something that I've found to be a simple workaround is to simply use a box-shadow rather than a border... This doesn't break the grid system. For example, in your case:</p>

<p><strong>HTML</strong></p>

<pre><code>&lt;div class="container"&gt;
    &lt;div class="row" &gt;
        &lt;div class="span12"&gt;
            &lt;div class="row"&gt;
                &lt;div class="span4"&gt;
                    1
                &lt;/div&gt;
                &lt;div class="span4"&gt;
                    2
                &lt;/div&gt;
                &lt;div class="span4"&gt;
                    3
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p><strong>CSS</strong></p>

<pre><code>.span12{
    -moz-box-shadow: 0 0 2px black;
    -webkit-box-shadow: 0 0 2px black;
    box-shadow: 0 0 2px black;
}
</code></pre>

<p><a href="http://jsfiddle.net/77Udx/1/" rel="nofollow">Fiddle</a></p>


blocks|key|1466726|text|不幸的是，这就是边框的作用，它们被算作元素占据的空间的一部分。请允许我介绍一下border不太为人所知的表亲：outline。它实际上与border相同。唯一不同的是，它的行为更像长方体阴影，因为它不会占用布局中的空间，而且它必须位于元素的所有4个边。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1466727|http://codepen.io/cimmanon/pen/wyktr|1466728|.foo+{
++++outline:+1px+solid+orange;
}|code-block|syntax|javascript|1466729|entityMap|0|LINK|mutability|MUTABLE|url^0|1J|7|0|0|10|0|0|0^^$0|@$1|2|3|4|5|6|7|T|8|@$9|U|A|V|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|W|8|@]|D|@$9|X|A|Y|1|Z]]|E|$]]|$1|H|3|I|5|J|7|10|8|@]|D|@]|E|$K|L]]|$1|M|3|-4|5|6|7|11|8|@]|D|@]|E|$]]]|N|$O|$5|P|Q|R|E|$S|G]]]]

<p>Unfortunately, that's what borders do, they're counted as part of the space an element takes up.  Allow me to introduce border's less commonly known cousin:  <code>outline</code>.  It is virtually identical to border.  Only difference is that it behaves more like box-shadow in that it doesn't take up space in your layout and it has to be on all 4 sides of the element.</p>

<p><a href="http://codepen.io/cimmanon/pen/wyktr" rel="noreferrer">http://codepen.io/cimmanon/pen/wyktr</a></p>

<pre><code>.foo {
    outline: 1px solid orange;
}
</code></pre>


blocks|key|3808128|text|其他人提到的边框与边框绝对是正确的。不过，您仍然可以在不创建任何自定义类的情况下让它工作：http://jsfiddle.net/panchroma/yfzdD/|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|3808129|HTML|style|BOLD|3808130|<div+class="container">
<div+class="row"+>
++++<div+class="span12">
+++++++<div+class="row">
++++++++<div+class="span4">+1+</div>
++++++++<div+class="span4">+2+</div>
++++++++<div+class="span4">+3+</div>
++++++++</div>
++++</div>

</div>+
</div>|code-block|syntax|javascript|3808131|CSS|3808132|.span12{
border:solid+2px+black;
background-color:grey;++
}++|3808133|祝好运!|3808134|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/panchroma/yfzdD/^0|19|10|0|0|0|4|0|0|0|3|0|0|0^^$0|@$1|2|3|4|5|6|7|10|8|@]|9|@$A|11|B|12|1|13]]|C|$]]|$1|D|3|E|5|6|7|14|8|@$A|15|B|16|F|G]]|9|@]|C|$]]|$1|H|3|I|5|J|7|17|8|@]|9|@]|C|$K|L]]|$1|M|3|N|5|6|7|18|8|@$A|19|B|1A|F|G]]|9|@]|C|$]]|$1|O|3|P|5|J|7|1B|8|@]|9|@]|C|$K|L]]|$1|Q|3|R|5|6|7|1C|8|@]|9|@]|C|$]]|$1|S|3|-4|5|6|7|1D|8|@]|9|@]|C|$]]]|T|$U|$5|V|W|X|C|$Y|Z]]]]

<p>What others have mentioned about border vs border box is definitely correct. You can still get this to work without having to create any custom classes though: <a href="http://jsfiddle.net/panchroma/yfzdD/">http://jsfiddle.net/panchroma/yfzdD/</a>  </p>

<p><strong>HTML</strong>  </p>

<pre><code>&lt;div class="container"&gt;
&lt;div class="row" &gt;
    &lt;div class="span12"&gt;
       &lt;div class="row"&gt;
        &lt;div class="span4"&gt; 1 &lt;/div&gt;
        &lt;div class="span4"&gt; 2 &lt;/div&gt;
        &lt;div class="span4"&gt; 3 &lt;/div&gt;
        &lt;/div&gt;&lt;!-- end nested row --&gt;
    &lt;/div&gt;&lt;!-- end span 12 --&gt;

&lt;/div&gt; &lt;!-- end row --&gt;
&lt;/div&gt;&lt;!-- end container --&gt;
</code></pre>

<p><strong>CSS</strong>  </p>

<pre><code>.span12{
border:solid 2px black;
background-color:grey;  
}  
</code></pre>

<p>Good luck!</p>


blocks|key|1471489|text|从Bootstrap+3开始，您可以使用Panel类：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1471490|<div+class="panel+panel-default">Surrounded+by+border</div>|offset|length|style|CODE|1471491|在Bootstrap+4中，您可以使用边界类：|1471492|<div+class="border+border-secondary">Surrounded+by+border</div>|1471493|entityMap^0|0|0|1N|0|0|0|1R|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@$D|P|E|Q|F|G]]|9|@]|A|$]]|$1|H|3|I|5|6|7|R|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|S|8|@$D|T|E|U|F|G]]|9|@]|A|$]]|$1|L|3|-4|5|6|7|V|8|@]|9|@]|A|$]]]|M|$]]

<p>As of Bootstrap 3, you can use Panel classes:</p>

<p><code>&lt;div class="panel panel-default"&gt;Surrounded by border&lt;/div&gt;</code></p>

<p>In Bootstrap 4, you can use Border classes:</p>

<p><code>&lt;div class="border border-secondary"&gt;Surrounded by border&lt;/div&gt;</code></p>


blocks|key|3808275|text|根据您希望div的大小，您可以利用Bootstrap的内置组件thumbnail类，以及(或不使用)网格系统在每个div项周围创建边框。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|3808276|Bootstrap网站上的+演示了易用性，并且不需要任何特殊的附加+CSS**:**|BOLD|3808277|<div+class="row">
++++<div+class="col-xs-6+col-md-3">
++++++++<a+href="#"+class="thumbnail">
++++++++++++<img+src="..."+alt="...">
++++++++</a>
++++</div>
++++...
</div>|code-block|syntax|javascript|3808278|，它生成以下+div+网格项目：|3808279|​|3808280|📷|atomic|3808281|3808282|或添加一些附加内容：|3808283|<div+class="row">
++<div+class="col-sm-6+col-md-4">
++++<div+class="thumbnail">
++++++<img+src="..."+alt="...">
++++++<div+class="caption">
++++++++<h3>Thumbnail+label</h3>
++++++++<p>...</p>
++++++++<p>
++++++++++++<a+href="#"+class="btn+btn-primary"+role="button">Button</a>
++++++++++++<a+href="#"+class="btn+btn-default"+role="button">Button</a>
+++++++</p>
++++++</div>
++++</div>
++</div>
</div>|3808284|，它生成以下+div+网格项目：|3808285|3808286|3808287|3808288|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/731e787fc6d9ab3b7d6c1365cb6340e5.png|imageAlt|1|https://ask.qcloudimg.com/http-save/yehe-900000/6c8fcba9cd03c4ac40f5b9b7d89e251d.png^0|5|3|V|9|1L|3|0|E|J|Y|5|Y|3|0|0|0|6|7|3|B|5|7|3|0|0|0|1|0|0|0|0|A|0|0|0|6|7|3|B|5|7|3|0|0|0|1|1|0|0^^$0|@$1|2|3|4|5|6|7|1F|8|@$9|1G|A|1H|B|C]|$9|1I|A|1J|B|C]|$9|1K|A|1L|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|1M|8|@$9|1N|A|1O|B|H]|$9|1P|A|1Q|B|H]|$9|1R|A|1S|B|C]]|D|@]|E|$]]|$1|I|3|J|5|K|7|1T|8|@]|D|@]|E|$L|M]]|$1|N|3|O|5|6|7|1U|8|@$9|1V|A|1W|B|H]|$9|1X|A|1Y|B|H]|$9|1Z|A|20|B|H]|$9|21|A|22|B|C]]|D|@]|E|$]]|$1|P|3|Q|5|6|7|23|8|@]|D|@]|E|$]]|$1|R|3|S|5|T|7|24|8|@]|D|@$9|25|A|26|1|27]]|E|$]]|$1|U|3|Q|5|6|7|28|8|@]|D|@]|E|$]]|$1|V|3|W|5|6|7|29|8|@$9|2A|A|2B|B|H]]|D|@]|E|$]]|$1|X|3|Y|5|K|7|2C|8|@]|D|@]|E|$L|M]]|$1|Z|3|10|5|6|7|2D|8|@$9|2E|A|2F|B|H]|$9|2G|A|2H|B|H]|$9|2I|A|2J|B|H]|$9|2K|A|2L|B|C]]|D|@]|E|$]]|$1|11|3|Q|5|6|7|2M|8|@]|D|@]|E|$]]|$1|12|3|S|5|T|7|2N|8|@]|D|@$9|2O|A|2P|1|2Q]]|E|$]]|$1|13|3|Q|5|6|7|2R|8|@]|D|@]|E|$]]|$1|14|3|-4|5|6|7|2S|8|@]|D|@]|E|$]]]|15|$16|$5|17|18|19|E|$1A|1B|1C|-4]]|1D|$5|17|18|19|E|$1A|1E|1C|-4]]]]

<p>Depending what size you want your <code>div</code> to be, you could utilize Bootstrap's built-in component <code>thumbnail</code> class, along with (or without) the grid system to create borders around each of your <code>div</code> items.</p>

<p><strong><a href="https://getbootstrap.com/docs/3.3/components/#thumbnails" rel="nofollow noreferrer">These examples</a> on Bootstrap's website demonstrates the ease-of-use and lack of need for any special additional <code>CSS</code>:</strong></p>

<pre><code>&lt;div class="row"&gt;
    &lt;div class="col-xs-6 col-md-3"&gt;
        &lt;a href="#" class="thumbnail"&gt;
            &lt;img src="..." alt="..."&gt;
        &lt;/a&gt;
    &lt;/div&gt;
    ...
&lt;/div&gt;
</code></pre>

<p><strong>which produces the following <code>div</code> grid items:</strong></p>

<p><a href="https://i.stack.imgur.com/XzMv9.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/XzMv9.png" alt="Simple grid objects"></a></p>

<p><strong>or add some additional content:</strong></p>

<pre><code>&lt;div class="row"&gt;
  &lt;div class="col-sm-6 col-md-4"&gt;
    &lt;div class="thumbnail"&gt;
      &lt;img src="..." alt="..."&gt;
      &lt;div class="caption"&gt;
        &lt;h3&gt;Thumbnail label&lt;/h3&gt;
        &lt;p&gt;...&lt;/p&gt;
        &lt;p&gt;
            &lt;a href="#" class="btn btn-primary" role="button"&gt;Button&lt;/a&gt;
            &lt;a href="#" class="btn btn-default" role="button"&gt;Button&lt;/a&gt;
       &lt;/p&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p><strong>which produces the following <code>div</code> grid items:</strong></p>

<p><a href="https://i.stack.imgur.com/SB1wP.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/SB1wP.png" alt="Custom grid objects"></a></p>


blocks|key|1471606|text|如果你需要一个基本的边界，你只需要使用bootstrap+well。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1471607|例如，下面的代码：|1471608|<div+class="well">Basic+Well</div>|code-block|syntax|javascript|1471609|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>If you need a basic border around you just need to use bootstrap wells.</p>

<p>For example the code below: </p>

<pre><code>&lt;div class="well"&gt;Basic Well&lt;/div&gt;
</code></pre>


blocks|key|5224804|text|如果您使用的是Bootstrap4和更高版本，请尝试使用border+border-primary在空div周围放置边框，下面是我的代码示例：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|5224805|<div+class="row+border+border-primary">
++++++++<div+class="col+border+border-primary">logo</div>
++++++++<div+class="col+border+border-primary">navbar</div>
++++</div>|code-block|syntax|javascript|5224806|下面是指向Bootstrap4中的边界实用程序的链接：https://getbootstrap.com/docs/4.2/utilities/borders/|5224807|entityMap|0|LINK|mutability|MUTABLE|url|https://getbootstrap.com/docs/4.2/utilities/borders/^0|S|L|0|0|R|1G|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@$9|V|A|W|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|X|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|Y|8|@]|D|@$9|Z|A|10|1|11]]|E|$]]|$1|M|3|-4|5|6|7|12|8|@]|D|@]|E|$]]]|N|$O|$5|P|Q|R|E|$S|T]]]]

<p>If you are using Bootstrap 4 and higher try this to put borders around your empty divs use <code>border border-primary</code> here is an example of my code:</p>
<pre><code>&lt;div class=&quot;row border border-primary&quot;&gt;
        &lt;div class=&quot;col border border-primary&quot;&gt;logo&lt;/div&gt;
        &lt;div class=&quot;col border border-primary&quot;&gt;navbar&lt;/div&gt;
    &lt;/div&gt;
</code></pre>
<p>Here is the link to the border utility in Bootstrap 4:
<a href="https://getbootstrap.com/docs/4.2/utilities/borders/" rel="nofollow noreferrer">https://getbootstrap.com/docs/4.2/utilities/borders/</a></p>


<p>How can I solve this problem?
When you add borders to a div, the div is not centered and
the <code>span12</code> class is not centered.</p>

<p>I would like to center the div with the borders</p>

<pre><code>&lt;div class="row" &gt;
   &lt;div class="span12" style="border: 2px solid black"&gt;
      &lt;div class="row"&gt;
         &lt;div class="span4"&gt;
            1
         &lt;/div&gt;
         &lt;div class="span4"&gt;
            2
         &lt;/div&gt;
         &lt;div class="span4"&gt;
            3
         &lt;/div&gt;
      &lt;/div&gt;
   &lt;/div&gt;
&lt;/div&gt;
</code></pre>


How to use border with Bootstrap

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我该如何解决这个问题？向div添加边框时，div不居中，span12类也不居中。我想用边框居中显示div<div class="row" >   <div class="span12" style="border: 2px solid black">      <div class="row">         <di...

问如何通过Bootstrap使用边框
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何通过Bootstrap使用边框EN