CSS :: Свойство empty-cells
http://belarusweb.net
Основы создания сайтов

CSS :: Свойство empty-cells

css-свойство empty-cells (от англ. empty cellsпустые ячейки) позволяет регулировать отображение границ и фона ячеек, у которых отсутствует содержимое (т.е. пустых ячеек). Браузеры считают ячейку пустой, если у нее отсутствуют любые символы, за исключением пробельных, либо значение свойства visibility установлено, как hidden.

Если используется свойство border-collapse со значением collapse, свойство empty-cells игнорируется.

Характеристики

  • Значение по умолчанию: show.
  • Применяется: к элементам <td>, <th>, а также ко всем элементам, у которых значение display установлено в table-cell.
  • Наследуется: да.
  • Анимируется: нет.
  • JavaScript: object.style.emptyCells="value".

Синтаксис

empty-cells: show | hide

Значения

  • hide – фон и границы пустых ячеек не отображаются.
  • show – фон и границы пустых ячеек отображаются.

Ссылки

Примеры

HTML Результат BwCodes
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">  
	<title>Пример №1</title>

	<style>
	
		table{
		width: 45%;
		margin-top: 3em;
		border: 1px solid green;
		}
		
		td{
		width: 15%;
		border: 1px solid green;
		background-color: yellow;
		}

		/* Для ячеек в нечетных строках	*/	
		tr:nth-child(odd) td{
		empty-cells: hide;
		}
		
	</style>
	
</head>
<body>
	
	<table>
				
		<tr>
			<td>Ячейка 1.1</td> <td></td> <td>Ячейка 1.3</td>
		</tr>
		
		<tr>
			<td>Ячейка 2.1</td> <td></td> <td>Ячейка 2.3</td>
		</tr>
		
		<tr>
			<td>Ячейка 3.1</td> <td></td> <td>Ячейка 3.3</td>
		</tr>		
		
		<tr>
			<td>Ячейка 4.1</td> <td></td> <td>Ячейка 4.3</td>
		</tr>		
		
	</table>	
		
</body>
</html>		

Пример №1