在样式属性中使用导入

Question

First let me be perfectly clear. I am talking about importing a css file within a html style='' attribute. You can assume Internet Explorer 9.

I DON'T CARE ABOUT <link> TAGS or other methods of importing css.

Lets say I have a simple .css file:

#inputArea{
width: width:72px;
}

Why is this import not working?

<input type=text id='inputArea' style="@import url(simple.css);">

When this import does work?

<style>
    @import url(simple.css);
</style>

When does a style="" attribute import work? Why isn't this one working?

Answer 1

The style attribute takes a list of declarations , and applies properties from that list specifically to the owner element.

@import is not a declaration and does not apply to a particular element. It can only appear in the top level of a style sheet along with the selectors and other @ -constructs that comprise the statements .

It doesn't make any sense to import a stylesheet, that contains rules selecting other elements, into an element's inline style. It's like saying:

<input type=text id='inputArea' style="body { margin: 0 }">

which is just as meaningless.