visibility
Имовина у ЦСС-у има две различите функције. Сакрива редове и колоне табеле, а такође скрива елемент без промене распореда.
p ( visibility: hidden; ) tr ( visibility: collapse; )
visibility
има четири валидне вредности: visible
, hidden
, collapse
, и inherit
. Проћи ћемо кроз сваку од њих да бисмо сазнали више.
видљиво
Баш као што звучи, visible
чини ствари видљивим. Подразумевано се ништа не крије, тако да ова вредност не чини ништа ако нисте поставили hidden
овај или родитељ овог елемента.
сакривен
hidden
Вредност крије ствари. Ово се разликује од употребе display: none
, јер hidden
само визуелно сакрива елементе. Елемент је још увек ту и још увек заузима простор на страници, али више га не можете видети (некако попут окретања непрозирности на 0). Занимљиво је да ово својство не наслеђује по дефаулту. То значи да, за разлику од display
или opacity
својстава, можете да направите елемент hidden
и још увек имате једно од његових подређених, на пример visible
, овако:
Приметите да, иако је скривени, надређени елемент не покреће :hover
.
колапс
Овај само утиче на редове табеле ( ), групе редова (попут
), колоне (
), групе колона (
) или елементе направљене да буду на тај начин путем
display
).
За разлику од hidden
ове вредности, ова вредност скрива поделемент табеле, не остављајући простор тамо где је била. Ако се користи било где, осим на поделементу табеле, делује као visibility: hidden
.
Има толико чудних ствари с тим да је тешко знати одакле почети. Баш као предјело:
- Цхроме / Сафари ће срушити ред, али простор који је заузео остаће. А ако су ћелије табеле унутар имале обруб, то ће се срушити у једну обруб дуж горње ивице.
- Цхроме / Сафари неће сажети колону или групу колона.
- Сафари сажме ћелију табеле (погрешно), али Цхроме неће (тачно).
- У било ком прегледачу, ако се ћелија налази у колони која је скупљена (без обзира да ли се стварно скупља), текст у тој ћелији неће бити приказан.
- Опера (пре ВебКит) ће уништити срање од свега, осим од ћелије табеле (што је тачно).
Има још, али у основи: немојте ово никада користити.
наследити
Подразумевана вредност. Ово једноставно доводи до тога да елемент наследи вредност свог родитеља.
Флекбок
visibility: collapse;
се користи и у Флекбок-у, и прецизније је дефинисан.
Подршка прегледача
Основе, не узимајући у обзир све хировитости са колапсом:
Било који | Било који | Било који | 4+ | 4+ | Било који | Било који |
ИЕ 7- не подржава collapse
или inherit
.