Відображення елементів CSS | Приховування елементів CSS

C допомогою стилів css ми можемо приховувати потрібні і непотрібні елементи з якого-то події. Наприклад, при натисканні на кнопку приховати картинку і т.д.

Таблиця 2.10. Властивості управління відображенням вмісту елемента
Властивості	Опис	Типове	Застосування
`overflow`	<Накладення/TD>	`visible`	ДО блочним або замещаемым елементів
`clip`	Область відображення	`auto`	ДО блочним або замещаемым елементів
`visibility`	Відображення	`inherit`	До всіх елементів

Вигляд накладення

overflow:visible|hidden|scroll|auto

visible - зміст не обрізається, а може відображатися і поза межами,
hidden - зміст обрізається за кордонів, прокрутка не передбачена,
scroll - зміст обрізається за кордонів, передбачений механізм прокрутки
auto - обробка визначається браузером.

Область відображення

clip:shape|auto

auto - область відображення має той же розмір і ті ж кордону, що і сам елемент
shape - форма області відображення - прямокутник rect (верх, право, вниз, ліворуч), для якого задаються зміщення щодо меж елемента. Негативні зміщення забезпечують відображення поза межами елемента.

Спосіб відображення

visibility:visible|hidden|collapse

visible - область відображення видима,
hidden - частина області відображення, що виходить за межі, не видима (прозора),
collapse - частина області відображення, що виходить за межі, прихована.

<IMG id="&#1053;&#1086;&#1089;&#1086;&#1088;&#1086;&#1075;"
src="/CSS/nosorog.gif" width="148" height="125"
 style="visibility:visible"><BR>
<input onClick="if (this.value=='Сховати') 
{Носорог.style.visibility='hidden'; this.value='Показати'}
 else  {Носорог.style.visibility='visible';
 this.value='Сховати'}" 
 type="button" value="Сховати">