Проблемы верстки в ИЕ6.

amelice · July 14, 2011

Всем привет.

Помогите разобраться:

1. Возможно ли решить проблему связанную с :hover в ИЕ6, когда нужно его применить не только ссылке?

В меню я применила :hover к трем трем элементам, чтобы меню растягивалось не зависимо от разрешения экрана.

2. Есть прозрачный фон, в Ие 6 это серый фон. Как добиться прозрачности?

Может это тема обсуждалась, но я не нашла.

Ссылка.

Прошу не обращать внимания на баннеры, это за бесплатный хостинг. (

Great Rash · July 14, 2011

1) Только скриптом: «ie6 hover» в Google.

2) http://forum.htmlbook.ru/index.php?showtopic=10595

UPD: а не, по второму вопросу не понял сразу, подумал что про PNG речь, вот так делается прозрачный фон:


.opacity {
  background-color: rgba(100, 100, 100, 0.5);
}

<!--[if lt IE 9]>
.opacity {
  background:transparent;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);
  zoom: 1;
}
<![endif]-->

Bonzash · July 14, 2011

Наверное надо выделить жирным и шрифт увеличить для этого заголовка Полезные темы

amelice · July 14, 2011

1) Только скриптом: «ie6 hover» в Google.
2) http://forum.htmlbook.ru/index.php?showtopic=10595
UPD: а не, по второму вопросу не понял сразу, подумал что про PNG речь, вот так делается прозрачный фон:
.opacity {
  background-color: rgba(100, 100, 100, 0.5);
}

Ты все правильно понял, вопрос как раз по поводу применения прозрачного png-файла было.

Буду штудировать топик, спасибо.

amelice · July 14, 2011

Great Rash, я тебя сразу не поняла. Твой пример в моем случае идеально б подошел. Тогда б отпала необходимость в использовании Png файла. Но у меня тока в фф работает.

В ИЕ вообще не работает.

А в коде условные комментарии должны находится между тегами <style>?

Как расшифровать этот фильтр?

Я в CSS файле написала:

.marker{
  background-color: rgba(0, 0, 0, 0.5);
  margin-top:225px;
  clear:both;
  width:100%;
  height:58px;
  }

а в html:


<style type="ctext/css">
<!--[if lt IE 9]>
.marker {
  background-color:transparent;
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);
	zoom: 1;
}
<![endif]-->
</style>
.
.
.
<ul class="marker">
 <li><a href="#"><img src=""><span>Contacts</span></a></li>
 <li><a href="#"><img src=""><span>About</span></a></li>
 <li><a href="#"><img src=""><span>Product</span></a></li>
</ul>

sigma77 · July 14, 2011

cheburek,


<!--[if lt IE 9]>
<style type="ctext/css">
.marker {
  background-color:transparent;
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);

        zoom: 1;
}

</style>
<![endif]-->

Внутри таблицы css не должно быть условных комментариев.

amelice · July 14, 2011

cheburek,

Внутри таблицы css не должно быть условных комментариев.

а куда его нужно писать?

sigma77 · July 14, 2011

cheburek,

Вокруг <style> Смотри мои исправления.

Еще лучше вынести все эти стили в отдельный файл.

SelenIT · July 14, 2011

Как расшифровать этот фильтр?

Фильтр задает градиент, по умолчанию горизонтальный сверху вниз, параметры — начальный и конечный цвета. Если цвета одинаковы (как тут), получается сплошная заливка. Прелесть фильтра в том, что цвета можно задавать в формате ARGB, который почти тот же rgba, только в чуть другом синтаксисе (прозрачность пишется в начале и тоже шестнадцатеричным числом, 00 - полная прозрачность, FF - полная непрозрачность). В итоге можно сделать полупрозрачную заливку фона. Вот здесь есть с виду удобный конвертор rgba в ARGB и обратно: Convert to and from rgba() and #ARGB.

amelice · July 14, 2011

cheburek,
Вокруг <style> Смотри мои исправления.
Еще лучше вынести все эти стили в отдельный файл.

sigma77я извиняюсь, не внимательно посмотрела.

Лучше наоборот, добавочный <style> брать в усл. комментарии.

это поняла, а в коде где? Между тегами <head>? :blush:

sigma77 · July 14, 2011

это поняла, а в коде где? Между тегами <head>?

Да. <style> или <link> со ссылкой на css-файл для ИЕ помещаешь в <head> и обрамляешь их условными комментариями. Это если тебе надо подключить стили.

А так условные комментарии могут быть в любом месте кода.

Например:


<!--[if IE]>
	<p>Этот абзац увидет только ИЕ</p>
<![endif]-->

Вот, например, статьи про условные комментарии - http://htmlbook.ru/content/uslovnye-kommentarii, http://designformasters.info/posts/conditional-comments/

И вот еще заметила у тебя одну ошибку:

<style type="ctext/css">

amelice · July 14, 2011

Как расшифровать этот фильтр?
Фильтр задает градиент, по умолчанию горизонтальный сверху вниз, параметры — начальный и конечный цвета. Если цвета одинаковы (как тут), получается сплошная заливка. Прелесть фильтра в том, что цвета можно задавать в формате ARGB, который почти тот же rgba, только в чуть другом синтаксисе (прозрачность пишется в начале и тоже шестнадцатеричным числом, 00 - полная прозрачность, FF - полная непрозрачность). В итоге можно сделать полупрозрачную заливку фона. Вот здесь есть с виду удобный конвертор rgba в ARGB и обратно: Convert to and from rgba() and #ARGB.

SelenIT спасибо огромное за пояснения.

К сожалению, у меня интернет выборочно и долго работает.

(startColorstr=#99000050,endColorstr=#99000050)

Я как поняла первые шесть цифры отвечают за цвет, а последние два за прозрачность как и в rgba.

у меня фон получается синий и прозрачный при этих значениях, теперь жду когда сайт загрузится. Мне нужен черный фон. Дай пожалуйста линки, где можно почитать про фильтры?

это поняла, а в коде где? Между тегами <head>?
Да. <style> или <link> со ссылкой на css-файл для ИЕ помещаешь в <head> и обрамляешь их условными комментариями. Это если тебе надо подключить стили.
А так условные комментарии могут быть в любом месте кода.
Например:

Вот, например, статьи про условные комментарии - http://htmlbook.ru/content/uslovnye-kommentarii, http://designformasters.info/posts/conditional-comments/

Спасибо! Все понятно.

И вот еще заметила у тебя одну ошибку:
<style type="ctext/css">

Да, тоже обнаружила.

Edited July 14, 2011 by cheburek

sigma77 · July 14, 2011

Я как поняла первые шесть цифры отвечают за цвет, а последние два за прозрачность как и в rgba.
у меня фон получается синий и прозрачный при этих значениях, теперь жду когда сайт загрузится. Мне нужен черный фон.

Не, наоборот

Первые две - прозрачность. Остальные - цвет.

Дай пожалуйста линки, где можно почитать про фильтры?

Могу только на английском дать.

Правда там почти везде есть ссылка на пример, где можно поиграть со значениями.

http://msdn.microsoft.com/en-us/library/ms532853(v=VS.85).aspx

web-monster · July 14, 2011

Вот все решения прозрачности в IE6. Ссылка.

Сам пользуюсь скриптом DD_belated.png.

amelice · July 14, 2011

Всем большое спасибо!

Если кому интересно, 1-ый вопрос решила 1-ым вариантом, который на этом сайте представлен. Сама реализация мне не понятно, но очень простой в использовании.

Sign In

Проблемы верстки в ИЕ6.

Question

Link to comment

Share on other sites

14 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information