Как я могу использовать Modernizr, чтобы заставить border-radius работать в IE8?

Я знаю, что в IE8 было много статей о получении скругленных углов. Мой вопрос в том, как использовать Modernizr для поддержки функций CSS3/HTML5?

Например, чтобы показать скругленные углы в IE8, я использую свойство CSS-3

-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;

Я включил Modernizr в свою страницу, но все еще не могу видеть закругленные углы в IE8.

1 2
css3 html5 modernizr

1 ответ:

Modernizr не включает функции, он просто проверяет, доступны ли они. Для CSS он также может устранить необходимость использовать специфические свойства поставщика, такие как -moz-* и -webkit-*, позволяя вам просто использовать стандартные свойства: 

.myElement {
    -webkit-border-radius: 20px; /* No need for this */
    -moz-border-radius: 20px;    /* No need for this */
    border-radius: 20px;
}

Для скругленных углов в IE8 я бы не стал утруждать себя обнаружением функций Modernizr, просто используйте CSS PIE, чтобы включить их.

.myElement {
    border-radius: 8px;
    behavior: url(/PIE.htc); /* only IE will use this */
}

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

В качестве примечания, стандартное border-radius уже довольно давно поддерживается браузерами mozilla и webkit, вы можете проверить, действительно ли вы нацелены на какие-либо браузеры, которым нужны эти префиксы: http://caniuse.com/#search=border-radius (нажмите "Показать все версии")

8