Прозрачность: 0 имеет тот же эффект, что и видимость: скрытый

Ответ 1

Вот компиляция проверенной информации из различных ответов.

Каждый из этих свойств CSS фактически уникален. В дополнение к тому, что элемент невидим, они имеют следующие дополнительные эффекты:

• Сбрасывает пространство, которое элемент обычно занимает
• Отвечает на события (например, нажмите, нажмите)
• Участвует в taborder

                     collapse events taborder
opacity: 0              No     Yes     Yes
visibility: hidden      No     No      No
visibility: collapse    *      No      No
display: none          Yes     No      No

* Yes inside a table element, otherwise No.

Ответ 2

Нет.

Элементы с непрозрачностью создают новый контекст стекирования.

Кроме того, спецификация CSS не определяет это, но элементы с opacity:0 являются кликабельными, а элементы с visibility:hidden не являются.

Ответ 3

Нет, нет. Существует большая разница. Они похожи, потому что вы можете видеть через элемент, если видимость скрыта или непрозрачность равна 0, однако

непрозрачность: 0: вы не можете нажать на элементах, расположенных за ним.

видимость: скрытая: вы можете нажать на элементах, расположенных за ней.

Ответ 4

Я не уверен полностью, но вот как я просматриваю прозрачность браузера:

opacity: 0.6;
-moz-opacity: 0.6;
filter: alpha(opacity=60);

объекты с видимостью: скрытые все еще имеют форму, они просто arent видны. opacity zero elements все еще можно щелкнуть и отреагировать на другие события.

Ответ 5

Я не совсем уверен в этом, но я думаю, что читатели с экрана не читают то, что скрыто для видимости, но они могут читать вещи независимо от их непрозрачности.

Это единственное различие, о котором я могу думать.

Ответ 6

При создании пользовательского стиля, который влияет на элементы в contenteditable, я заметил, что если вы установите что-то в visibility: hidden, то входная каретка действительно не хочет взаимодействовать с ним. Например, если у вас

<div contenteditable><span style='visibility: hidden;'></span></div>

... тогда кажется, что если вы фокусируете этот div/span, вы не можете на самом деле вводить его. Принимая во внимание, что с opacity: 0, похоже, вы можете. Я не тестировал это широко, но решил, что стоит упомянуть об этом здесь, поскольку никто на этой странице не говорил о влиянии на ввод текста. Вероятно, это связано с тем, что упоминалось выше в событиях.

Ответ 7

То, что говорит Фил, верно.

IE поддерживает непрозрачность, хотя:

filter:alpha(opacity=0);

Ответ 8

Свойства имеют разные смысловые значения. В то время как семантический CSS звучит так, как будто это может быть глупо, как говорят другие пользователи, это влияет на такие устройства, как устройства чтения с экрана, где семантика влияет на доступность страницы.