Javascript-форум (https://javascript.ru/forum/)
-   (X)HTML/CSS (https://javascript.ru/forum/xhtml-html-css/)
-   -   Table, разные стили по столбцам (https://javascript.ru/forum/xhtml-html-css/72151-table-raznye-stili-po-stolbcam.html)

pokk 12.01.2018 07:21

Table, разные стили по столбцам
 
Добрый день подскажите, можно ли сделать разделение стилей у первого столбца и второго.
К примеру вынести в стиль width="198" width="545"
что бы это применялось сразу к нескольким таблицам.

<table  id="center_tabl" >
<tr>
<th colspan="2" id="id_sernumber_clik" class="tabl" name="N_SerNumber" id="TablCondSerNumber">Заголовок</th>
</tr>
<!------------------------------------------------------------------ -->
<tr>
<td width="198" id="table_left">Включить/Выключить</td>
<td width="545" colspan="2"  id="table_right">
<input id="id_ButOn" name="N_ButOn" type="button" style="width:80px" value="Включить">
<input id="id_ButOff" name="N_ButOff" type="button" style="width:80px" value="Выключить">
</td>
</tr>											
<!------------------------------------------------------------------ -->
</table>

Nexus 12.01.2018 08:31

Вы про атрибут «class» слышали?
http://htmlbook.ru/html/attr/class

pokk 12.01.2018 09:42

Слышал, но не охото было его ко всем полям писать.

ksa 12.01.2018 10:26

Цитата:

Сообщение от pokk
К примеру вынести в стиль width="198" width="545"

У тех элементов есть ИД - применяй селектор идентификатора в ЦСС, вот тебе и "вынос в стили". ;)

рони 12.01.2018 10:41

pokk,
:-?
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .demo td:nth-child(1){
    width :198px;
    background-color: #FF00FF;
  }
  .demo td:nth-child(2){
    width :545px;
    background-color: #0000FF;
  }
  .demo td:nth-child(2) input{
    width :80px;
    background-color: #FFFF00;
  }
  </style>

</head>

<body>
<table  id="center_tabl"  class="demo">
<tr>
<th colspan="2" id="id_sernumber_clik" class="tabl" name="N_SerNumber" id="TablCondSerNumber">Заголовок</th>
</tr>
<!------------------------------------------------------------------ -->
<tr>
<td  id="table_left">Включить/Выключить</td>
<td  colspan="2"  id="table_right">
<input id="id_ButOn" name="N_ButOn" type="button"  value="Включить">
<input id="id_ButOff" name="N_ButOff" type="button"  value="Выключить">
</td>
</tr>
<!------------------------------------------------------------------ -->
</table>


</body>
</html>

pokk 12.01.2018 13:01

ksa, да временно так и сделал, но хотел от них полностью избавиться.
рони, Благодарю!!!! то что надо читал что nth-child(2) и тд для таблиц с colspan не подходит, по пробовал нечего не вышло, но видать криво пробовал :)


Часовой пояс GMT +3, время: 22:15.