Можно использовать относительные правила:
table td + td + td + td + td {
border: none;
}
Это только работает, если число столбцов не определяется во времени выполнения.
Для IE, как насчет того, чтобы использовать выражение CSS:
<style type="text/css">
table td {
h: expression(this.style.border = (this == this.parentNode.lastChild ? 'none' : '1px solid #000' ) );
}
</style>
Не прямой ответ на Ваш вопрос, но использующий < tfoot> мог бы помочь Вам достигнуть того, в чем Вы нуждаетесь, и конечно можно разработать tfoot.
Можно использовать элемент седла, как определено в HTML 4.0 ( ссылка ). Это работает в каждом браузере. Можно дать ему идентификатор или класс или встроенный стиль. только протест состоит в том, что это влияет на целый столбец через все строки. Пример:
<table>
<col />
<col width="50" />
<col id="anId" />
<col class="whatever" />
<col style="border:1px solid #000;" />
<tbody>
<tr>
<td>One</td>
<td>Two</td>
<td>Three</td>
<td>Four</td>
<td>Five</td>
</tr>
</tbody>
</table>
Если Вы уже используете JavaScript, смотрят на jQuery. Это поддерживает браузер независимый "последний дочерний" селектор, и можно сделать что-то вроде этого.
$("td:last-child").css({border:"none"})
Вы могли использовать последний дочерний psuedo класс
table tr td:last-child {
border: none;
}
, Это разработает последний td только. Это еще не полностью поддерживается, таким образом, это может быть неподходящее
:last-child
селектор должен сделать это, но это не поддерживается в любой версии IE.
я боюсь, что у Вас нет выбора, кроме как использовать класс.
JavaScript является единственным жизнеспособным способом сделать эту сторону клиента (то есть, CSS не поможет Вам). В jQuery:
$("table td:last").css("border", "none");
Это код, который добавит границу для всех узлов и удалит границу для последнего узла (TD).
<style type="text/css">
body {
font-family:arial;font-size: 8pt;
}
table td{
border-right: #666 1px solid
}
table td {
h: expression(this.style.border = (this == this.parentNode.lastChild ? 'none' : 'border-right: 0px solid' ) );
}
</style>
<table>
<tr>
<td>Home</td>
<td>sunil</td>
<td>Kumar</td>
<td>Rayadurg</td>
<td>Five</td>
<td>Six</td>
</tr>
</table>
Наслаждайтесь ...
Я хочу то же самое вместо границы я хотел использовать изображения ...: -)
В jQuery при условии, что таблица создается статически или динамически до следующего выполняется:
$("table tr td:not(:last-child)").css({ "border-right":"1px solid #aaaaaa" });
Просто добавляет правую границу к каждой ячейке в строке таблицы, кроме последней ячейки.
Существует также другой подход ... и он будет работать для таблиц, которые не являются статическими ... в основном используйте
вместо
для этого столбца:
<style type="text/css">
table td { border: 1px solid black; }
table th { border: 0px; }
<style>
<table>
<tbody>
<tr>
<td>One</td>
<td>Two</td>
<td>Three</td>
<td>Four</td>
<th>Five</th>
</tr>
<tr>
<td>One</td>
<td>Two</td>
<td>Three</td>
<td>Four</td>
<th>Five</th>
</tr>
</tbody>
</table>
Похожие вопросы: