Учим Internet Explorer понимать CSS3

22.07.2010   |  

HTML / CSS   |  

Комментарии (5)

Internet Explorer CSS3

Наверное для всех не будет секретом, что Internet Explorer не поддерживает CSS3, и это очень хре.ово для веб-мастеров.

Сейчас для того, чтобы работали функции CSS3 в IE 6-8, веб-мастера используют различные фильтры, но это сильно геморройной способ, и получаем много лишнего кода в файле style.css.

Я предлагаю гораздо более простой способ использовать, вместо фильтров, для того, чтобы Internet Explorer поддерживал CSS3 нам нужно просто подключить один файл в style.css, и наш Internet Explorer изучит CSS3, а теперь подробнее.

PIE (Progressive Internet Explorer) – по этой ссылке вам нужно будет скачать файл (PIE.htc), его и нужно будет подключить к нашему файлу style.css чтобы Internet Explorer стал понимать CSS3.

Чтобы подключить файл, нужно его переместить в корневую папку сайта, и прописать код в нужном месте в  файле style.css:  behavior: url (PIE.htc.)
Пример:

1
2
3
4
5
6
7
8
9
10
11
12
13
14

border: 1px solid #696;
padding: 60px 0;
text-align: center; width: 200px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: #666 0px 2px 3px;
-moz-box-shadow: #666 0px 2px 3px;
box-shadow: #666 0px 2px 3px;
background: #EEFF99;
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#EEFF99), to(#66EE33));
background: -moz-linear-gradient(#EEFF99, #66EE33);
-pie-background: linear-gradient(#EEFF99, #66EE33);
behavior: url(/PIE.htc);

Если вы все правильно сделаете, тогда ваш Internet Explorer 6-8 станет понимать такие CSS3 функции как:
- border-radius
- box-shadow
- border-image
- multiple background images
- linear-gradient
- background image

Проект PIE (Progressive Internet Explorer) пока находится на стадии разработке, поэтому ожидать большее количество доступных  функции CSS3 нужно в скором времени.

…
В Киеве не только цены на недвижимость падают, но и на гаражи и стоянки, цены также снизились, это на заметку авто-владельцам.

Интересные статьи:

  1. фывфыв 30.08.2010 23:18

    Не работает !!!

  2. Webchester 31.08.2010 18:01

    фывфыв:
    Что именно не работает и не получается у Вас, опишите.
    Возможно мы не правильно подключили файл??
    Файл PIE.htc должен быть в той папке, где и ваш style.css

  3. Тимур 01.09.2010 22:15

    behavior прописывается один раз в файле стилей в конце? Так?
    Или каждый раз при использовании новых атрибутов?

  4. f0rmat1k 02.09.2010 15:15

    Используйте position:relative и z-index:0 и все заработает

  5. Webchester 02.09.2010 15:52

    Тимур:
    Да однин раз, в низу или в верху файла style.css

Оставь свое мнение:




Подпишись на обновление блога