Скрыть что-нибудь с помощью CSS без отображения: нет или JavaScript

Вы можете расположить его абсолютно за пределами экрана.

Но я тоже не мобильный разработчик.

Это обычный способ:

margin-left: -9999;

visibility: hidden; будет работать, но место, занятое этим конкретным div, все равно появится. Если вы собираетесь использовать отрицательный метод left-margin, помните, что вам нужно будет установить для объекта position значение absolute.

<div style = "height:0;width:0;overflow:hidden;">
<!-- content here -->
</div>

Кстати, это то, что я делаю для предварительной загрузки изображений, что приятно, потому что здесь не используется javascript.

Видимость: скрытый не будет делать то же самое, потому что некоторые браузеры умны и не будут делать запрос, если он не считает, что он действительно виден.

что попробовать:

• используйте z-index, чтобы поместить его за другим элементом
• переместите его за пределы экрана с помощью абсолютного позиционирования
• видимость: скрыто
• сделать контент «невидимым», установив цвет фона на цвет переднего плана (работает только для текста)
• непрозрачность: 0

но настоящий вопрос: почему?

Почему бы не попробовать простое:

position: absolute;
left: -1000px;

Я не понимаю, почему это не сработает.

Как насчет:

  visibility: hidden;

Это должно скрыть DIV (обратите внимание, как он все равно будет отображаться, но будет невидимым, это означает, что он займет место в документе, как если бы он был видимым, но будет невидимым (в отличие от display: none; где div не будет отображаться) ).

Я предполагаю, что вы не хотите использовать JavaScript, потому что Blackberrys его не поддерживают.

А что, если бы вы сделали наоборот и отобразили блок кода с помощью JavaScript, а не пытались его скрыть?

<script type = "text/javascript"><!--
document.open();
document.writeln('<div class = "BBwarn">');
document.writeln('please activate your css support and a link');
document.writeln('</div>');
document.close();
//--></script>

Это немного похоже на взлом, но он не отображает текст с отключенным JavaScript ...

Я не уверен в процентах, о которых вы говорите, которые используют <4.6, но если это так важно для вас, то я вижу обоснование того, что вы не можете угодить всем людям все время, и приемлемое каскадное решение для этого должно быть достижимо. Вероятно, со ссылкой, объясняющей преимущества обновления и включения css.

height: 0; 
overflow: hidden;
visibility: hidden; 
color: #fff; 
background: #fff; 

Кстати - вам лучше убедиться, что у вас хороший css, если вы говорите кому-то включить его ... :-)

Почему вы думаете, что display: none не поддерживается до версии 4.6? Вы это проверяли или просматриваете их документацию?

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

BlackBerry Browser 4.6 Справочник по CSS действительно упоминает «Доступность: BlackBerry® Device Software версии 4.6 или более поздней» для свойства отображения, но их BlackBerry Browser 4.3 Руководство разработчика контента указывает, что 4.3 уже поддерживает очень ограниченную версию свойства display, включая display: none. Версии до 4.3 не поддерживают свойство display (опять же, Документация для разработчиков BlackBerry Browser).

Можете ли вы предположить, что у ваших пользователей есть по крайней мере версия прошивки 4.3, или это так же неприемлемо, как предположение, что у них есть версия 4.6?

Вы пробовали просто установить нулевую ширину и высоту? Я не знаком с BlackBerry (браузером), но я скептически предполагаю, что его поддержка CSS не совсем идеальна, особенно в старых версиях. Не удивлюсь, если это сработает:

.BBwarn {
    display: none; /* for 4.6 and up */
    width: 0px;    /* for 4.3 */
    height: 0px;
}

Но тогда width и height поддерживаются только на всех элементах, начиная с версии 4.3. Раньше они могли применяться только к тэгам <button> и <img> и некоторым типам <input> (согласно документации).

Так что, возможно, самый безопасный способ заставить его работать на всех версиях прошивки BlackBerry - использовать изображение для предупреждения и использовать CSS для установки его ширины и высоты на ноль.

Если изображение не является вариантом (возможно, из-за проблем с лозализацией), некрасивым взломом может быть указание пустого / недопустимого источника изображения и размещение текста предупреждения в атрибуте alt. Я не знаю, если бы установка его ширины и высоты на ноль по-прежнему скрывала этот альтернативный текст.

Что именно не так с (упомянутым ранее)

ширина: 0 высота: 0 видимость: скрыто

ширина: 0 высота: 0 видимость: скрыто

... Не всегда работает с прошивкой 2.2 и старше. Иногда можно сделать так, чтобы элемент был скрыт, но он будет снова появляться после определенных нажатий клавиш (например, подчеркивания).

Или вы можете использовать Пожалуйста, включите Javascript

И используйте изображение с надписью «Включить CSS» и стилизуйте его с помощью «display: none».

Таким образом, всякий раз, когда соответствующая функция включена, эти предупреждения не отображаются.

В качестве альтернативы, я полагаю, вы используете код на стороне сервера? Вы можете попробовать определить наиболее распространенные известные платформы, поддерживающие определенные версии css / javascript, и соответствующим образом доставлять контент. Возможно, вам даже не придется все это писать самому.

У меня была аналогичная проблема, когда я пытался настроить поле выбора с помощью javascript в BlackBerry Curve 8530 (OS 5.0). Но созданное меню не может быть скрыто, потому что следующие свойства css по-прежнему не работают:

display
overflow
position: absolute
visibility
z-index

И разрушение и воссоздание HTML-элементов тоже не сработало, поэтому я добрался сюда и смог решить свою проблему. Я знаю, что мой ответ не совсем касается поднятого здесь вопроса, но как только я попал сюда, когда возникли проблемы, я думаю, что я не единственный, с кем это произошло, и собираюсь это сделать.

В любом случае, даже если эти свойства css работают, мне нужен был код, который мог бы работать с большинством моделей BB.

Мое решение было сделано с использованием всех найденных здесь ответов. Все было просто. Сделал два класса:

.element
{
    width: 100px;
    height: 100px;
    font-size: 12px;
    color: black;
    background-color: transparent;
    border: 1px solid black;
}
.element_hidden
{
    width: 0px;
    height: 0px;
    font-size: 0px;
    color: white;
    background-color: white;
    border: none;
}

да. Я сделал по два для каждого типа элементов на моей странице. Первоначально для всех классов установлено значение class = "element_hidden", поэтому, когда указатель мыши находится над меню окна выбора, все классы изменяются на class = "element", и они отображаются и скрываются, как если бы они были сделаны невидимыми / видимыми.

Надеюсь, это может быть кому-то полезно! ; D

Вы можете сделать что-то вроде мудрого:

.class{
opacity:0; overflow:hidden; visibility: hidden; height:0;
}

для большей точности можно добавить:

color:transparent; background-color:transparent;

Как насчет этого:

clip: rect(0,0,0,0);

Примечание. Обратите внимание, что свойство clip не работает, если используется «overflow: visible».

В твоем случае:

<div class = "BBwarn">
  please activate your css support and a link
</div>

просто добавьте этот css:

.BBwarn{
  position: absolute;
  clip: rect(0,0,0,0);
}

Мы можем использовать свойство transform для масштабирования элемента по осям x и y.

. BBwarn{
   transform : scale(0,0);
}

Я использовал размер шрифта, чтобы получить это без использования display none

font-size: 0px;

Как вы сказали в вопросе, вам нужно решение для Версия Blackberry ниже 4.6 и очень мало свойств CSS, поддерживаемых для Blackberry версии ниже 4.6, поэтому мы можем использовать какой-то хак для этой цели. Попробуйте установить текст color на любой фон или установите font-size на 0. Это взлом, но он делает его невидимым. Запустите следующий фрагмент и дайте мне знать, работает ли он для вас.

.alert1 {
    color: #fff; //3.8 or later
    
}

.alert2 {
    font-size: 0; //3.8 or later
}

<b>Alert1</b>
<div class = "alert1">
please activate your css support and a link
</div>

<b>Alert2</b>
<div class = "alert2">
please activate your css support and a link
</div>