Блог

Главная - Вопросы по программированию - ошибки css border shadows в IE

ошибки css border shadows в IE

#css #internet-explorer

#css #internet-explorer

Вопрос:

Привет, я пытаюсь добавить границу к кнопке в cshtml

 .linkbig:hover {
    border: solid #000000 1px;
    -webkit-box-shadow: 6px 6px 5px #000000 ;
    width: inherit;
}

но все, что я получаю, это граница, когда я хочу тень, это сбой только в IE

любая помощь?

Комментарии:

1. box-shadow является стандартным свойством CSS. И все последние версии браузера поддерживают это. Однако, если вы нацелены на более старую версию, вам также необходимо использовать префикс поставщика.

2. К вашему сведению: Box shadow поддерживается только в IE9 и новее

Ответ №1:

-webkit- поддерживается только Safari, Chrome, Opera 15 .

Поэтому ваш код не будет работать в IE или Firefox.

Однако вы можете попробовать использовать:

 -moz-box-shadow: 6px 6px 5px #000000;  /* Firefox */
-ms-box-shadow: 6px 6px 5px #000000;  /* Internet Explorer */
box-shadow: 6px 6px 5px #000000; /* CSS3 */

Однако это поддерживается только IE 9 или более поздней версии.

Ответ №2:

тень окна в IE не требует префикса

 box-shadow: 1em 0.1em 0.5em 0.05em #000000;

или более старый IE, который вам нужен -ms 

 ms-box-shadow: 1em 0.1em 0.5em 0.05em #000000;

firefox потребуется -Moz 

 -moz-box-shadow: 1em 0.1em 0.5em 0.05em #000000;

если вам не нужна линия границы, вам нужно удалить это:

 border: solid #000000 1px;

или вы получите черную линию размером 1 пиксель вокруг вашей .linkbig , и это, вероятно, скроет вашу тень, если она действительно тонкая.

-Website поддерживается только Safari, Chrome, Opera.

Ответ №3:

Обновите свой CSS, как показано ниже. Чтобы он работал в Chrome, firefox и IE.

 .linkbig:hover {
border: solid #000000 1px;
-webkit-box-shadow: 6px 6px 5px #000000 ;
box-shadow: 6px 6px 5px #000000 ;
-moz-box-shadow: 6px 6px 5px #000000;
width: inherit;
}

Ответ №4:

Попробуйте так:

CSS:

 .linkbig:hover {
 -webkit-box-shadow: 6px 6px 5px #000000;
 -moz-box-shadow: 6px 6px 5px #000000;
 -o-box-shadow: 6px 6px 5px #000000;
 box-shadow: 6px 6px 5px #000000;
}

Ответ №5:

попробуйте это

   filter:
  progid:DXImageTransform.Microsoft.dropshadow(OffX=0, OffY=10, Color='#000000')