|
Страница 1 из 1 [ Сообщений: 22 ] |
Автор |
Сообщение |
Veles
новый человек
|
|
Как сделать рамку однопиксельную для таблиц?
Я делал так:
Код: <style type="text/css"> table{border-collapse: collapse;} td{border: 1px solid black;} </style>
Но такой код делает все таблицы документа с однопиксельной черной рамкой, а нужно чтобы только некоторые таблицы были такими.
Как это красивее сделать? Привязать это правило к определенной таблице.
|
|
 |
|
 |
TONIC XGM
старожил
|
|
…
Последний раз редактировалось TONIC XGM 26 Март 2008, 16:08:01, всего редактировалось 1 раз.
|
|
 |
|
 |
Kurilshik
Goldmember
|
|
создать класс и прописать его для какой нужно тыблицы
|
|
 |
|
 |
Kurilshik
Goldmember
|
|
Veles, что конкретно нужно сделать?
|
|
 |
|
 |
Kurilshik
Goldmember
|
|
Veles,
Код: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html> <head><style type="text/css"> /*класс для всех таблиц*/ table{background-color:red;color:#ffffff;} /*стиль для отдельных ячеек*/ .td{background-color:#ffffff;color:#000000;} </style></head><body> <table> <tr><td>text</td></tr> <tr><td>text</td></tr> <tr><td>text</td></tr> <tr class="td"><td>text</td></tr> <tr ><td>text</td></tr> </table></body></html>
|
|
 |
|
 |
Kurilshik
Goldmember
|
|
Veles, ну зачем именно так, если их сто, то практичнее их выводить циклом
|
|
 |
|
 |
Kurilshik
Goldmember
|
|
.talisman, ему просто нужны не все ячейки делать различными
|
|
 |
|
 |
Veles
новый человек
|
|
Вот забавный пример, но он не полностью через CSS сделан, а хочется именно через css:
Код: <style> table.tm td{background-color:#ffffff; text-align:center} </style>
<table class="tm" bgcolor="#000000" cellspacing=1 cellpadding=2 border=0 width=300> <tr> <td>a</td> <td>b</td> <td>c</td> <td>d</td> </tr> <tr> <td>e</td> <td>f</td> <td>g</td> <td>h</td> </tr> <tr> <td>i</td> <td>j</td> <td>k</td> <td>l</td> </tr> </table>
|
|
 |
|
 |
Kurilshik
Goldmember
|
|
Veles, ну так сделай 5 классов и указывай их дя 5 таблиц, помоему это нормально
|
|
 |
|
 |
IonDen666
 постоянный участник
|
|
вот так:
Код: .myTable {border-left:1px solid #000; border-top:1px solid #000;} .myTable td, .myTable th {border-right:1px solid #000; border-bottom:1px solid #000; padding:2px 4px 4px;}
|
|
 |
|
 |
Abstract
 постоянный участник
|
|
Veles, Цитата: | не вставляя в каждую строку класс |
Никак. Или вставляя ID.
|
|
 |
|
 |
karamba
старожил
|
|
Abstract писал(а): | Veles, Цитата: | не вставляя в каждую строку класс | Никак. Или вставляя ID. |
использовать айди сугубо для оформления -- суксь. Судя по уровню вопроса, товарищу до айди еще оооочень далеко...
_________________ клетчатый!
|
|
 |
|
 |
Veles
новый человек
|
|
IonDen666, большое спасибо!
Код: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <style type="text/css"> .myTable {border-left:1px solid #000; border-top:1px solid #000;} .myTable td, .myTable th {border-right:1px solid #000; border-bottom:1px solid #000; padding:2px 4px 4px;} </style> </head> <body> <table width="400" class="myTable" cellspacing=0 > <tr> <td>dsfasdf</td> <td>&</td> </tr> <tr> <td> </td> <td>&</td> </tr> </table> </body> </html>
Минусы:
1) если ячейка полностью пустая, то рамки в ней нет, нужно пробел вставлять
2) внутри таблицы другие таблицы тоже будут с рамками, но редко нужно.
|
|
 |
|
 |
IonDen666
 постоянный участник
|
|
Veles, это для чистых таблиц. С этим кодом можно конечно извращатся как попало.
Последний раз редактировалось IonDen666 20 Декабрь 2005, 20:55:24, всего редактировалось 1 раз.
|
|
 |
|
 |
Битник
новый человек
|
|
Abstract писал(а): | Veles, Цитата: | не вставляя в каждую строку класс | Никак. Или вставляя ID. |
Всё возможно. Надо использовать контекстные селекторы, как выше написал IonDen666.
|
|
 |
|
 |
Ainur
соучастник
|
|
Veles, Код: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>—</title> <style type="text/css"> <!-- .border{ border-collapse: collapse; border-style:solid; } --> </style> </head>
<body> <table class="border" border="1" cellspacing="0" cellpadding="0"> <tr> <td>&</td> <td>&</td> </tr> <tr> <td>&</td> <td>&</td> </tr> </table> </body> </html>
|
|
 |
|
 |
Abstract
 постоянный участник
|
|
Битник, ну контекстные селекторы. Какая разница? Суть-то в том, что по любому необходимо одни таблицы отличить от других. Понятно, что если задача сформулирована именно настолько абстрактно, как в данном случае, то всё равно самым прямым решением является класс.
Ainur, понятно, что так можно, но зачем снова городить код в теге, вместо того, чтобы всё решить во внешнем CSS?
|
|
 |
|
 |
|
Страница 1 из 1 [ Сообщений: 22 ] |
Уровень доступа: Вы не можете начинать темы. Вы не можете отвечать на сообщения. Вы не можете редактировать свои сообщения. Вы не можете удалять свои сообщения. Вы не можете добавлять вложения.
|
|