фон или цвет фона? Какой из них безопасен в использовании? - PullRequest
Новая
       0

фон или цвет фона? Какой из них безопасен в использовании?

0 голосов
/ 03 августа 2011

Я только что обнаружил, что когда я пытаюсь изменить background-color, используя YUI для тела, он не работает в FF5 и Opera, но работает в IE и Chrome.Однако, если я установлю значения цвета для background, это будет работать в FF так же, как и в Opera.Я думал, что background-color это просто какая-то специализация для background.Какой из них можно безопасно использовать во всех браузерах?Код, о котором идет речь, можно увидеть здесь, background или background-color?Какой из них безопасно использовать? , у меня все еще есть проблема с пониманием того, как YUI обрабатывает события.Я также разместил здесь страницу с измененным кодом http://www.kumarchetan.com/yui-module.html,, попробуйте зайти на эту страницу с помощью IE, Chrome, FF и Opera и обратите внимание, как плавно меняются значения в разных браузерах.

Ответы [ 5 ]

3 голосов
/ 03 августа 2011

Это потому, что Сброс CSS YUI устанавливает свойство background для элемента html вместо body, поэтому, если вы хотите указать другой цвет фона страницы, сделайте это для html. Это не связано с какими-либо проблемами совместимости между background-color и сокращением background, поскольку оба свойства полностью поддерживаются (в любом случае, версия CSS1) во всех браузерах.

РЕДАКТИРОВАТЬ: о, вы имеете в виду, что вы использовали JavaScript API YUI ... в этом случае это несоответствие свойств стиля DOM. Действительно, вы должны использовать нотацию camelCase для кросс-браузерной совместимости (это относится не только к YUI, но и к DOM в целом). IE и Chrome также поддерживают дефисные имена свойств.

1 голос
/ 03 августа 2011

Чтобы исправить вашу проблему, добавьте этот CSS: 

html, body {
    margin: 0;
    padding: 0;
    height: 100%
}

html и body не занимают 100% высоты, что необходимо для обработки mousemove событий. background для корневого элемента обрабатывается специально , но это не то же самое, что иметь высоту 100%.

Причина несовместимого поведения между браузерами, возможно, связана с правкой @ BoltClock, а также, вероятно, с тем фактом, что ваша страница использует Режим причуд , поскольку у вас нет типа документа , Добавьте это как самую первую строку: 

<!DOCTYPE html>
0 голосов
/ 03 августа 2011

+ 1 к ответу BoltClock, так как это, вероятно, правильный вариант в этом случае, однако у меня недавно была похожая ситуация с другим решением, поэтому я решил поделиться.

В моем случае рассматриваемый элемент имел градиентный фон: 

background: -moz-linear-gradient(top, #c2c2c2, #ffffff);

Установка background-color не влияла на этот элемент, так как градиент имел приоритет над цветом. Мне пришлось использовать background, чтобы переопределить его.

0 голосов
/ 03 августа 2011

Они оба могут безопасно использоваться во всех браузерах.

background может установить все его податрибуты, такие как background-color, background-image, background-position и т. Д.

Так что вместо настройки 

background-color: #fff; /* white */
background-image: url(path/to/image.png);
background-repeat: repeat; /* or repeat-x, repeat-y, none */
background-position: top center; /* other options include bottom, right, left, along with pixel values and percentages*/
background-attachment: scroll; /* or fixed */

ты можешь написать background: #fff url(path/to/image.png) top center fixed;

0 голосов
/ 03 августа 2011

Нет реальной разницы между этими двумя, если вы не устанавливаете изображение и цвет. Если вы устанавливаете только одну вещь, вы можете просто использовать background.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...