2

我正在尝试编写一个将@import语句转换为 <link>标签的脚本，我有两个问题：

  1. 一个声明和其他样式声明可以在标签@import内共存吗？<style>例如：

    <style type="text/css">
    @import url(http://www.example.com/style.css);
    body {
        background: #FFF;
    }
    ..NUI_ContentFrameHeader_l {
        clear: both;
        height: 50px;
        margin: 0;
        color: black;
        background: url(/vpn/images/NUI_box_l.png) no-repeat left top;
        border: solid 0px #BBC6D6;
        overflow: hidden;
        letter-spacing: 0;
        padding: 0 0 0 15px;
    }
</style>

  2. @import如果标签的开头有多个语句<style>并且这不是范围样式标签，我们可以将@import语句转换为语句并将它们移动到标签<link>上方吗？<style>喜欢：

    <style type="text/css">
    @import url(http://www.example.com/style1.css);
    @import url(http://www.example.com/style2.css)
    body {
        background: #FFF;
    }
    ..NUI_ContentFrameHeader_l {
        clear: both;
        height: 50px;
        margin: 0;
        color: black;
        background: url(/images/NUI_box_l.png) no-repeat left top;
        border: solid 0px #BBC6D6;
        overflow: hidden;
        letter-spacing: 0;
        padding: 0 0 0 15px;
    }
</style>

    会变成：

    <link type="text/css" media="screen" rel="stylesheet"
                        href="http://www.example.com/style1.css" />
<link type="text/css" media="screen" rel="stylesheet"
                        href="http://www.example.com/style2.css" />
<style type="text/css" media="screen">
    body {
        background: #FFF;
    }
    ..NUI_ContentFrameHeader_l {
        clear: both;
        height: 50px;
        margin: 0;
        color: black;
        background: url(/images/NUI_box_l.png) no-repeat left top;
        border: solid 0px #BBC6D6;
        overflow: hidden;
        letter-spacing: 0;
        padding: 0 0 0 15px;
    }
</style>
4

1 回答 1

0

@import 语句和其他样式语句可以在标签内共存吗？

是的。

如果标签开头有多个@import 语句，并且这不是一个作用域样式标签，我们可以将@import 语句转换为语句并将它们移动到标签上方吗？

是的。

由于阻塞文件加载，将语句转换为自己的样式表被认为是最佳实践——如果它们在自己的标签中作为单独的表格加载，它们可以由浏览器并行加载。@import@import<style>

于 2013-02-08T04:33:33.570 回答