引导表没有新行 [英] Bootstrap table no new line
问题描述
< h3> Mijn biedingen< / h3>
< table class =table table-responsive>
< thead>
< tr>
< th> nummerplaat< / th>
< th> Bod< / th>
< th>状态< / th>
< th> Datum bod< / th>
< th> Aankoopdatum< / th>
< / tr>
< / thead>
< tbody>
< tr>
< td> THOMAS< / td>
< td>& euro; 90 000,00< / td>
< td> open< / td>
< td> 15/10/2014< / td> ¥b $ b< td>
Niet beschikbaar
< / td>
< / tr>
< / tbody>
< / table>
这是我的代码,这是结果: https://www.dropbox.com/s/6vkc2mpu7z4yqgq/Screenshot%202014- 10-15%2019.28.09.png?dl = 0
我如何在一条线上有钱TD?
如果你想有一个文本框,同一行中的文本使用CSS样式
white-space:nowrap;
例如:
code>< span class =nowrap>此处的文字< / span>
在CSS样式表中
.nowrap {
white-space:nowrap;
}
Bootstrap的方法
由于你已经有了bootstrap,不需要类定义,可以使用 text-nowrap
只要在你的td中尝试这个,或者如果不工作,尝试在你的文本周围添加一个 span
,并分配
例如:
td class =text-nowrap>您的文字< / td>
或
< td> < span class =text-nowrap>您的文字< / span>< / td>
在Bootstrap 文档检查对齐类
<h3>Mijn biedingen</h3>
<table class="table table-responsive">
<thead>
<tr>
<th>nummerplaat</th>
<th>Bod</th>
<th>Status</th>
<th>Datum bod</th>
<th>Aankoopdatum</th>
</tr>
</thead>
<tbody>
<tr>
<td>THOMAS</td>
<td>€ 90 000,00</td>
<td>open</td>
<td>15/10/2014</td>
<td>
Niet beschikbaar
</td>
</tr>
</tbody>
</table>
This is my code, this is the result: https://www.dropbox.com/s/6vkc2mpu7z4yqgq/Screenshot%202014-10-15%2019.28.09.png?dl=0
How can I have the money TD on one line? This website is responsive but the the text becomes in two lines because of the spaces in the text.
If you want to have the text in same line use CSS style
white-space:nowrap;
eg:
<span class="nowrap">Your text here</span>
In CSS style sheet
.nowrap {
white-space:nowrap;
}
Bootstrap way of doing it
Since you already have bootstrap, no need of class definition, you can use class text-nowrap
Just try this in your td or if doesn't work try adding a span
around your text and assign the class
eg:
<td class="text-nowrap"> Your text </td>
or
<td> <span class="text-nowrap">Your text </span></td>
More on this in Bootstrap documentation Check under Alignment classes
这篇关于引导表没有新行的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!