Internet ExplorerでCSSが正しく動作する方法

Question

私は以下のCSSを使用してボタンをより魅力的にしています。

Google Chromeはうまく動作しますが、Internet Explorerでは色付きのボックスしか表示されません。

このCSSはInternet Explorerでどのように役立つのですか。

button { 
 
    background: #eb0505; 
 
    background-image: -webkit-linear-gradient(top, #eb0505, #b82b2b); 
 
    background-image: -moz-linear-gradient(top, #eb0505, #b82b2b); 
 
    background-image: -ms-linear-gradient(top, #eb0505, #b82b2b); 
 
    background-image: -o-linear-gradient(top, #eb0505, #b82b2b); 
 
    background-image: linear-gradient(to bottom, #eb0505, #b82b2b); 
 
    -webkit-border-radius: 28; 
 
    -moz-border-radius: 28; 
 
    border-radius: 28px; 
 
    font-family: Georgia; 
 
    color: #ffffff; 
 
    font-size: 20px; 
 
    padding: 10px 20px 10px 20px; 
 
    text-decoration: none; 
 
}

<button>Button</button>

助けてください。

Answer 1

しかし、あなたのコードはIE11で正常に動作している、IE 9のためにあなたがこれを使用することができます：

使用しているIEのバージョン

background: #eb0505; 
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#eb0505', EndColorStr='#b82b2b'); 
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#eb0505', EndColorStr='#b82b2b')"; 
    background-image: -webkit-linear-gradient(top, #eb0505, #b82b2b); 
    background-image: -moz-linear-gradient(top, #eb0505, #b82b2b); 
    background-image: -ms-linear-gradient(top, #eb0505, #b82b2b); 
    background-image: -o-linear-gradient(top, #eb0505, #b82b2b); 
    background-image: linear-gradient(to bottom, #eb0505, #b82b2b); 
    -webkit-border-radius: 28; 
    -moz-border-radius: 28; 
    border-radius: 28px; 
    font-family: Georgia; 
    color: #ffffff; 
    font-size: 20px; 
    padding: 10px 20px 10px 20px; 
    text-decoration: none; 

Answer 2

button { 
      background: #eb0505; 
      border-radius: 28px; 
      font-family: Georgia; 
      color: #ffffff; 
      font-size: 20px; 
      padding: 10px 20px 10px 20px; 
      text-decoration: none; 
     } 


<button>Button</button>