Проблема отображения цвета в IE. Простое решение.
7 сентября 2008. Разместил: RedRat
С этой проблемой столкнулся каждый вебдизайнер и верстальщик при достижении кросс-браузенга (одинаковое отображение страницы во многих обозревателях). Суть проблемы в том, что Internet Explorer отображает цвета не как, к примеру, Opera, FireFox. Но эту проблему можно обойти, если цвета задавать НЕ через коды ”#FFBBFF” и ”rgb(255,255,255)”, а через фоновую картинку (IE отображает ее, как есть, без каких, либо искажений цветов).
Например, рассмотрите код .
<div style='background-color:#B1F59D; width:100px; height:100px; border:1px solid black'>
#B1F59D
<img src="1.png">
</div>
Просмотрите его сначала в Opera и Firefox, а потом в IE.
Вот как отображается цвет ‘#B1F59D’ в Опере, Мозиле и в ИЕ. Для более сильного контраста отличия отображения цвета я добавил в код страницы картинку 1.png (50 на 50), которая залита этим цветом.
Вот что получилось. Картинка с залитым фоном явно выделяется из общего фона в IE. Теперь вам понятно, что такое искажение цвета в ИЕ?!
Это исправить просто. Создайте фоновую картинку размеров 1 на 1 пиксель и залейте тем цветом, который хотите, установит в фон и чтобы он отображался во многих браузерах одинаково.
Примерно будет получаться такой код.
<div style='background-color:#B1F59D; background-image:url(‘1x1.png’); width:100px; height:100px; border:1px solid black'>
#B1F59D
</div>
IE будет отображать фоновую картинку как есть без искажения цвета.
Например, рассмотрите код .
<div style='background-color:#B1F59D; width:100px; height:100px; border:1px solid black'>
#B1F59D
<img src="1.png">
</div>
Просмотрите его сначала в Opera и Firefox, а потом в IE.
Вот как отображается цвет ‘#B1F59D’ в Опере, Мозиле и в ИЕ. Для более сильного контраста отличия отображения цвета я добавил в код страницы картинку 1.png (50 на 50), которая залита этим цветом.
Вот что получилось. Картинка с залитым фоном явно выделяется из общего фона в IE. Теперь вам понятно, что такое искажение цвета в ИЕ?!
Это исправить просто. Создайте фоновую картинку размеров 1 на 1 пиксель и залейте тем цветом, который хотите, установит в фон и чтобы он отображался во многих браузерах одинаково.
Примерно будет получаться такой код.
<div style='background-color:#B1F59D; background-image:url(‘1x1.png’); width:100px; height:100px; border:1px solid black'>
#B1F59D
</div>
IE будет отображать фоновую картинку как есть без искажения цвета.