Как я могу разрешить css-предупреждения для определенных браузеров селекторов в Bootstrap 3? - программирование
Подтвердить что ты не робот

Как я могу разрешить css-предупреждения для определенных браузеров селекторов в Bootstrap 3?

Просто включите файлы bootstrap.js и css и откройте консоль google chrome, есть много "Недопустимых свойств CSS xxx", я не видел этого раньше на bootstrap 2.3.2

Я скопировал предупреждения ниже. Они толпит мою консоль:

Invalid CSS selector: button::-moz-focus-inner,input::-moz-focus-inner (12:59:57:616 | warning, css)
  at public_html/css/bootstrap.min.css:9
Invalid CSS selector: .form-control:-moz-placeholder (12:59:57:630 | warning, css)
  at public_html/css/bootstrap.min.css:9
Invalid CSS selector: .form-control::-moz-placeholder (12:59:57:631 | warning, css)
  at public_html/css/bootstrap.min.css:9
Invalid CSS selector: .form-control:-ms-input-placeholder (12:59:57:661 | warning, css)
  at public_html/css/bootstrap.min.css:9
Invalid CSS property name: -webkit-overflow-scrolling (12:59:57:662 | warning, css)
  at public_html/css/bootstrap.min.css:9
Invalid CSS property value: transform .3s ease-out (12:59:57:663 | warning, css)
  at public_html/css/bootstrap.min.css:9
Invalid CSS property value: -webkit-linear-gradient(left,color-stop(rgba(0,0,0,0.5) 0),color-stop(rgba(0,0,0,0.0001) 100%)) (12:59:57:664 | warning, css)
  at public_html/css/bootstrap.min.css:9
Invalid CSS property value: -webkit-linear-gradient(left,color-stop(rgba(0,0,0,0.0001) 0),color-stop(rgba(0,0,0,0.5) 100%)) (12:59:57:670 | warning, css)
  at public_html/css/bootstrap.min.css:9
Invalid CSS property value: -webkit-linear-gradient(top,#fff,0%,#e6e6e6,100%) (12:59:57:674 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#428bca,0%,#3071a9,100%) (12:59:57:675 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#5cb85c,0%,#449d44,100%) (12:59:57:683 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#f0ad4e,0%,#ec971f,100%) (12:59:57:684 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#d9534f,0%,#c9302c,100%) (12:59:57:684 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#5bc0de,0%,#31b0d5,100%) (12:59:57:685 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#428bca,0%,#357ebd,100%) (12:59:57:685 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#fff,0%,#f8f8f8,100%) (12:59:57:691 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#3c3c3c,0%,#222,100%) (12:59:57:692 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#dff0d8,0%,#c8e5bc,100%) (12:59:57:693 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#d9edf7,0%,#b9def0,100%) (12:59:57:694 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#fcf8e3,0%,#f8efc0,100%) (12:59:57:694 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#f2dede,0%,#e7c3c3,100%) (12:59:57:695 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#ebebeb,0%,#f5f5f5,100%) (12:59:57:696 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#428bca,0%,#3071a9,100%) (12:59:57:696 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#5cb85c,0%,#449d44,100%) (12:59:57:697 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#5bc0de,0%,#31b0d5,100%) (12:59:57:701 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#f0ad4e,0%,#ec971f,100%) (12:59:57:701 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#d9534f,0%,#c9302c,100%) (12:59:57:702 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#428bca,0%,#3278b3,100%) (12:59:57:702 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#f5f5f5,0%,#e8e8e8,100%) (12:59:57:703 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#428bca,0%,#357ebd,100%) (12:59:57:704 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#dff0d8,0%,#d0e9c6,100%) (12:59:57:704 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#d9edf7,0%,#c4e3f3,100%) (12:59:57:705 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#fcf8e3,0%,#faf2cc,100%) (12:59:57:705 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#f2dede,0%,#ebcccc,100%) (12:59:57:706 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1
Invalid CSS property value: -webkit-linear-gradient(top,#e8e8e8,0%,#f5f5f5,100%) (12:59:57:707 | warning, css)
  at public_html/css/bootstrap-theme.min.css:1

( Переформатировав код, stackoverflow попросил меня добавить более подробные сведения в описание. Я попал в ту же проблему, и это самый важный вопрос в результатах поиска Google, надеюсь, у кого-то есть решение. )

4b9b3361

ОТВЕТЫ

Ответ 1

Самое главное отметить, что Chrome говорит вам, что считает, что эти селектора CSS недействительны. Это, однако, не означает, что они по своей сути и/или универсально недействительны или что вы каким-то образом ошиблись.

Две основные точки кодирования:

  • Браузеры (обычно) игнорируют большинство вещей, которые они не понимают, и это обычно относится и к CSS.
  • В то время как браузеры стараются придерживаться основных спецификаций, когда дело доходит до CSS, они печально известны своими атрибутами CSS для определенных вещей, особенно при поддержке старых браузеров.

Итак, имея в виду эти две вещи, авторы CSS, у которых есть большая, разнообразная база браузеров для поддержки (например, Twitter Bootstrap), будут использовать все селектора CSS и такие для всех браузеров, которые они намереваются поддерживать, зная, что IE будут игнорировать селектор, поддерживаемый браузерами на основе WebKit, и Chrome будет игнорировать специфику IE и так далее.

Здесь приведена соответствующая статья об этом методе при обработке градиентов: Разметка синтаксиса линейного градиента CSS3.

Еще одна причина, по которой вы недавно видите предупреждение:

Итак, если вы видите предупреждение CSS для "-webkit-overflow-scrolling", и если вы используете Chrome 28 или более позднюю версию, я могу понять, почему вы начнете просматривать предупреждения CSS, связанные с WebKit. (Я не тестировал регрессию с версиями до и после WebKit Chrome до 100%, но мой Geek Intuition ™ на 90% уверен, что здесь происходит).

Опять же, я бы не стал беспокоиться об этом, пока то, что вы видите, это то, что вы ожидаете. Не забудьте проверить браузер на основе WebKit, чтобы убедиться, что код, ориентированный на WebKit, также работает.