java - 在表中修改列 (CSS)

标签 java html css tablelayout spacing

middle += "<tr class='tRow'>"
               + "<td>"
                  + "<a href='" + output.get(i).get("itemURL") + "'>"
                  + gallery 
                  + "</a>"
               + "</td>"
               + "<td class='title'>"
                  + "<a href='" + output.get(i).get("itemURL") + "'>"
                  + ""+ (output.get(i).get("title")).replaceAll("\"","\'\'")+"" // replaces quatations into '

                  + "</a>"
               + "</td>"
               +

名称为“title”(类名)的列需要受样式表的影响以减小列的宽度。只有那一列需要受到影响。还有更多的列。 这是 CSS:

td.title{
          width:18%;
         }

但是这个 CSS 会影响表格中的所有列。其余列的宽度受到影响,但其中一些列的宽度与 CSS 指定的宽度不同。我试过内联样式表,但它仍然影响所有列。 问题是什么?干杯

其他详细信息: 私有(private)字符串 getBeginning(int tableNumber) {

      return "<html><head><title>"+ (tableNumber - 1)+"</title>"

          + "</head><body>"
          + "<table id='example' class='tablesorter' cellpadding='3' >" // border='1' cellpadding='1' cellspacing='2'
          + "<thead>"
                 + "<tr class='tHead'>"
                       + "<th/>"
                       + "<th>Title</th>"
                       + "<th>Total Price</th>"
                       + "<th>Currency</th>"
                       + "<th>Condition</th>"
                       + "<th>Location</th>"
                       + "<th>End Time</th>"
                       + "<th>Map</th>"
                + "</tr>"
          + "</thead>"
          + "<tbody>";
}


       middle += "<tr class='tRow'>"
               + "<td>"
                  + "<a href='" + output.get(i).get("itemURL") + "'>"
                  + gallery 
                  + "</a>"
               + "</td>"
               + "<td class='title'>"
                  + "<a href='" + output.get(i).get("itemURL") + "'>"
                  + ""+ (output.get(i).get("title")).replaceAll("\"","\'\'")+"" // replaces quatations into '

                  + "</a>"
               + "</td>"
               + "<td>"
                  + ""+output.get(i).get("total") +""
               + "</td>"
               + "<td>"
                  + ""+output.get(i).get("currency")+""
               + "</td>"
               + "<td>"
                  + ""+condition+""
               + "</td>"
               + "<td>"
                  + ""+output.get(i).get("location")+""
               + "</td>"
               + "<td>"
                  + ""+output.get(i).get("endTime").split("T")[0]+""
               + "</td>"
               + "<td>"
               + "<a href='" + getMap(location, postCode, "0") + "'>"
               + "<img src='" + getMap(location, postCode, "1") + "'> "
               +"</a>"
               + "</td>"
               + "</tr>";

字符串结束="";

我在 Firefox 3.6.11 上运行这个 Web 应用程序。没有尝试在不同的浏览器上运行它。

最佳答案

这里需要注意的重要一点是,百分比值与表格的可用空间量相关,与页面或包含的 div 无关。尝试使用像 200 这样的绝对值。如果您已经在表格上设置了 width,这也可能会使事情变得复杂,这意味着您不会让浏览器决定它最终的宽度。

无需查看其余代码,也不知道表格处于什么上下文中,也不知道表格本身是否设置了宽度,我可以告诉您,当表格本身设置了宽度时,可以在单个列上设置宽度在它上面会改变其他列的宽度,因为它们会碰撞以填满空间。在这种情况下,让单元格的大小自行排序通常是个好主意,因为用于设置宽度的算法是非常动态的。或者,您可以非常严格地设置每列的宽度,完全按照您希望它显示的方式设置。

要阅读该主题,请参阅 the HTML specification.

关于java - 在表中修改列 (CSS),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5583451/

相关文章:

java - 如何在参数化测试中测试异常?

java - 液位动画(电池医生)

html - 滚动 Bootstrap 3 时保持导航栏宽度相同

javascript - Polymer:Vers 简单数据绑定(bind)在第二个元素中不起作用

html - 无法让两个 div 水平对齐

java - JSF 不显示第一行、第一列数据

html - 在 iPad/移动设备上缩小页面

javascript - jQuery toggleClass 不会切换单独的缩略图单击操作

html - IE 表行跨度兼容性

java - SWTBot 中的剪贴板访问