我有一个要求。谁能帮我解决这个问题。
我有一个宽度为 350px 的列(td)。如果该列的内容超过,则相邻列的值被推到右边。所以我试图实现一个可折叠的列(显示/隐藏)。该列应仅显示适合 350 像素宽度的内容,当单击该列中的“显示”链接时,应显示其余内容。我该怎么做?
我没有遇到任何符合我要求的例子。请帮助..
最佳答案
以下是我的代码的一部分。我正在尝试为第二个 td 实现可折叠列。
<table style="width:760px; line-height: 25px; font-weight:bold; padding:8px; margin-top: 3px; margin-bottom: 3px;" cellpadding="0" cellspacing="0">
<tr>
<td style="border-top: 1px dotted #0A7A48; border-bottom: 1px dotted #0A7A48; ">
<table style="width:760px; line-height: 25px; font-weight:bold;" cellpadding="0" cellspacing="0">
<tr>
<td style="width:60px; text-align:left; color:#000; padding-left: 3px;"> Qty </td>
<td style="width:390px; text-align:left; color:#000;"> Part# / Description </td>
<td style="width:210px; text-align:left; padding-left: 3px; color:#000;"> Manufacturer </td>
<td style="width:50px; color:#000;"><span style="width:48px;"> </span></td>
</tr>
</table>
</td>
</tr>
<tr><td>
<s:iterator value="readQuoteList" var="entry">
<s:iterator value="#entry.value" var="arrayList">
<table style="width:760px; line-height: 25px; font-weight:bold;" cellpadding="0" cellspacing="0">
<tr>
<td style="width:60px; text-align:left; padding-left: 3px;"><s:property value="qtyordered"/></td>
<td style="width:390px; text-align:left; padding-left: 3px;"><s:property value="shortDesc"/></td>
<td style="width:210px; text-align:left; padding-left: 30px;"><s:property value="manufacturerName"/></td>
<td style="width:50px; color:#0A7A48; float: right;"><a style="cursor: pointer;" onclick="removeItem('<s:property value="#entry.key"/>')">Remove</a></td>
</tr>
</table>
</s:iterator>
</s:iterator>
</td></tr>
<tr><td align="center">
<table cellpadding="0" cellspacing="0"><tr>
<td style="padding-right:5px;"><a class="productDetailbutton" style="text-decoration:none; float: right; cursor:pointer;" onclick="saveHashListItm();">
<span id="saveHashListItm">Save List</span></a></td>
<td><a class="productDetailbutton" style="text-decoration:none; float: right; cursor:pointer;" onclick="removeAllItem()">
<span>Remove</span></a></td>
</tr></table>
</td></tr>
</table>
关于css - 可折叠栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10815639/