个人中心
文章发布
退出
作者热门文章
- objective-c - iOS 5 : Can you override UIAppearance customisations in specific classes?
- iphone - 如何将 CGFontRef 转换为 UIFont？
- ios - 以编程方式关闭标记的信息窗口 google maps iOS
- ios - Xcode 5 - 尝试验证存档时出现 "No application records were found"
26
4
我正在寻找一种仅使用 CSS 来“打破”表格行的方法。
我想改变这个:
为此:
我无权访问 HTML，但可以控制 CSS。
我试过了
td:nth-child(3) {
display: block;
}
但是好像不行。
下面是一些用于测试的简化代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style>
td:nth-child(3) {
display: block;
background-color: yellow;
}
</style>
</head>
<body>
<table border="1">
<tr>
<td>111111</td>
<td>222222</td>
<td>333333</td>
<td>444444</td>
</tr>
</table>
</body>
</html>
最佳答案
如何使用 inline-block 和固定的 width 表...或者使用 % 大约 45% width 为您的 td 元素，因此您不需要为 table
在这里，我只是将 td 转换为 display: inline-block; 并且由于固定的 width 表，它们将被强制换行到下一行。
我还使用 word-wrap: break-word; 属性，以便非空格字符串被强制中断。
table {
width: 120px;
}
table tr td {
width: 50px;
word-wrap: break-word;
}
table tr td {
display: inline-block;
margin-top: 2px;
}
您也可以使用基于 % 的 width，这样您就不需要关心单元格宽度....
你可能需要 vertical-align: top; 以及 min-height 如果你的 table 中的单元格是空白的p>
table tr td {
display: inline-block;
margin-top: 2px;
vertical-align: top;
min-height: 20px;
}
Demo (仅当单元格为空时才需要)
请注意 inline-block 会导致一些 4px 偏移问题，在这种情况下只需将 font-size: 0; 分配给table 并为您的 td 元素重新设置 font-size，这样您将获得单元格边距的一致性。
Warning: I would never ever recommend to do such types of things, so keep this as your last priority. If you have JavaScript control, than consider appending
traround thetd
从这里开始请忽略，如果您不能使用 jQuery，假设您有一个正在使用的 jQuery 库，您可以简单地将代码片段添加到该 JS 文件....
(我在这里添加一个class来唯一标识元素，class也可以使用.addClass()添加定义一些最接近的 CSS 选择器) 所以这里没有修改 HTML 的问题。
$('table.wrap_trs tr').unwrap(); //Remove default pre-generated tr
var cells = $('table.wrap_trs tr td');
for (var i = 0; i < cells.length; i += 2) {
cells.slice(i, i + 2).wrapAll('<tr></tr>'); //Wrapping the tds with tr
}
关于html - 仅使用 CSS 打破 <tr>，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22634419/
26
4
0
这是主函数，其中还调用了 9 个函数。我将向您展示另一个函数，以便您了解我的目标是什么。 int main() { char B[rows][columns]; char answer
每当我使用 preventDefault() 时，我通常将它放在事件处理程序的顶部，如下所示: $('#foo').on('click', function(e){ e.preventDefaul
我想要实现的是用户输入一个值，然后输入一个测量值。然后将其放置为最小、最大或介于两者之间。保留输入了多少个值的计数。以及以米为单位的所有值的总和。 程序最初可以运行，但是当我输入换行符时，程序会重复同
我无法打破 while 循环。 "; $quizslots = mysql_query("SELECT * FROM quiz_slots WHERE `quizid`=$quizsectio
所以我将一个模板化的二叉树字典实现为一个继承自抽象字典类的类，我的添加函数有一个我无法弄清楚的问题。 基本上，我的树的节点具有键和值，以及指向其父节点、左子节点和右子节点的指针。节点的代码是 stru
我的代码应该在内容之间放置一个横幅，但它正在循环播放横幅。我需要它只显示一个横幅。我试过使用 return false;，就像这个例子一样，但它没有用: $(".newsitem_text").con
我有一个 Storyboard指定用于登录我的应用程序。我将其嵌入到 UINavigationController 中。登录到我的应用程序(并过渡到新的 Storyboard)后，我想“脱离”这个导航
我想知道是否可以在不使用 MCU 复位引脚上的外部复位按钮的情况下中断 while 循环并从特定位置重新启动代码。 下面是当“if”语句为真时我想中断的 while 循环，我正在使用 LCD，并想返回
所以我有这个问题，如果数组中的值高于输入值，它应该做一些事情然后停止循环并且不要触及数组中的剩余值。这是到目前为止的代码: const percentages = []; let enteredVal
我想在“div2”中打断长字，div2 和 div3 的宽度都不能大于父宽度(即 150px)。唯一有效的是 word-break: break-all 但这也会打断短词。 #div1{ di
我的数据库中有 3 个表。 PARENT_A 有一个“ID”主键列。 PARENT_B 有一个“ID”主键列。 CHILD 具有“PARENT_A_ID”和“PARENT_B_ID”外键列。它还有一个
在这个非常人为的示例中，我有一个包含 3 个元素的数组，我使用 .each() 对其进行循环。方法。 var vals = $w('foo bar baz'); vals.each( function
非常简单的示例代码(仅用于演示，没有任何用处): repeat { while (1 > 0) { for (i in seq(1, 100)) { break # usual
我有以下 promise : var aggregatePromise = () => { return new Promise((resolve, reject) => { Ei
我想检测表单的“输入”键而不让表单被提交。我如何打破这种关联？ document.forms[0].onkeypress = function (event) { e = window.eve
这里是新手。我有一个 Ajax 函数，可以循环 3 个不同的请求。但是，如果第一个请求失败，我希望其他请求终止。我尝试放入“break”语句，但收到“非法的break语句”错误，我猜测是因为它不是直接
我有一个 Vector的 Vector不同长度的 s W .这些最后的向量包含 0 到 150,000 之间的整数，步长为 5，但也可以为空。我正在尝试计算每个向量的经验 cdf。我可以像这样计算这些
我想知道如何正确地打破 JS 中的 promise 链。 在这段代码中，我首先连接到数据库，然后检查集合是否已经有一些数据，如果没有则添加它们。不要关注一些 actionhero.js 代码..这里并
我有一个 Vector的 Vector不同长度的 s W .这些最后的向量包含 0 到 150,000 之间的整数，步长为 5，但也可以为空。我正在尝试计算每个向量的经验 cdf。我可以像这样计算这些
您可以使用 CompletableFuture 链接运行 block ，如下所示: CompletableFuture .supplyAsync(block1) .thenApply(
我是一名优秀的程序员,十分优秀！