Twitter bootstrap: cross browser rounded corners and gradients?

问题

Is there any way to add to Twitter Bootstrap cross browser support to rounded corners and css gradients (read: stupid IE 7+ support)?

回答1:

I'd use CSSPIE - http://css3pie.com/

It's a .htc file that will allow you to do this.

In any CSS selector where you're using border-radius (for example) you include the .htc as a behavior:

.rounded {
    border: 1px solid #999;
    -webkit-border-radius: 10px;
       -moz-border-radius: 10px;
            border-radius: 10px;
    behavior: url(path/to/PIE.htc);
}

NOTE: Make sure your path is relative to the root NOT the CSS file. It has to be this way for .htc files to run for some reason only Microsoft know.

回答2:

You can create your own conditional stylesheets for IE7, you will need to use images for both gradients and rounded corners.

But the best way is to convince the client (or whoever) that they should accept that their site will have no rounded corners or gradients on IE7. The designers should be aware of browser limitations and cater for that in briefs presented to the client.

来源：https://stackoverflow.com/questions/12912587/twitter-bootstrap-cross-browser-rounded-corners-and-gradients