Отправляет email-рассылки с помощью сервиса Sendsay

Уникальные уроки по теме сайтостроения

Подписаться Бесплатная новостная рассылка Подписчиков 2 RSS
←   Апрель 2014   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
27.04.2014
13:59:08
14:00:27
28
29
30


За последние 60 дней ни разу не выходила


Сайт рассылки: http://sitehere.ru
Открыта: 19-10-2013

Автор
Юрий Немец

Статистика

2 подписчиков
0 за неделю
←   Все выпуски   →

Уникальные уроки по теме сайтостроения Как сделать закругленные углы в Internet Explorer 8 и ниже


Закругленные углы в Internet Explorer 8 и ниже

CSS3 позволяет сделать закругленные углы у блока или изображения с помощью свойства border-radius. Но, как вы знаете, данное свойство не работает в браузере Internet Explorer 8 (IE8) и более ранних версиях. И когда вы применяете данное свойство, то оно выглядит точно также, без каких-либо закруглений.

Многие говорят что нужно просто игнорировать IE8. Конечно, можно сделать и так. Но если вы работаете в какой-нибудь фирме, или просто хотите чтобы сайт выглядел правильно во всех браузерах, то вы должны знать как это сделать.

CSS3Pie

CSS3 PIE(чтобы вы понимали CSS3 Progressive Internet Explorer) — это модуль, который позволяет использовать в браузере Internet Explorer некоторые свойства CSS3(тень, линейный градиент и закругленные углы).

В этой статье мы рассмотрим как данный модуль использовать, чтобы сделать закругленные углы.

Скачиваем данный модуль здесь.

И размещаем его в папке с файлом стилей вашего сайта:

Pie и файл стилей

Далее в файле стилей пишем:

1
2
3
4
5
6
7
8

.bradius {  
    height: 100px;  
    width: 100px;  
    background-color: #2ecc71;  
    -webkit-border-radius: 50px;  
    -moz-border-radius: 50px;  
    border-radius: 50px;  
}

Если браузер поддерживает CSS3, то мы увидим:

Поддержка CSS3

А в браузере IE8 и ниже мы увидите следующее:

IE8 и ниже

Для для того чтобы использовать файл PIE.htc, необходимо в файле index.html написать:

1
2
3
4
5

<style>
 .bradius {  
     behavior: url('css/PIE.htc');
}
</style>

Сейчас обновите страницу и увидите следующее:

Закругленные углы в IE8

Я проверял с помощью сервиса netrenderer.com.

Вывод

Если вы делаете сайт для кого-то, или просто хотите чтобы ваш сайт правильно и красиво выглядел во всех браузерах, тогда вам пригодится данное свойство.

Успехов!
В избранное