如何在正文中正确加载样式表?

the*_*cat 4 css external cross-browser web-standards stylesheet

我知道我可以把<link>标签放在正文中,显然它可以工作,但我知道它不是"有效"的HTML,我想避免使用像firefox这样的严格浏览器的问题,它忽略了网页设计师在没有定义的情况下所期望的每一个行为官方规范.

那么是否有一些官方方法在html的正文区域中加载样式表?

小智 9

您可以动态地在头部添加css,如下所示:

jsCode:

var head = document.getElementsByTagName("head")[0],
    cssLink = document.createElement("link");

cssLink.href = "path/to/filenam.css";
cssLink.id="dynamic-css";
cssLink.media="screen";
cssLink.type="text/css";

head.appendChild(cssLink);
Run Code Online (Sandbox Code Playgroud)

  • 对我来说,在 Chrome 64 中,这在我添加 `cssLink.rel = "stylesheet";` 之前不起作用 (3认同)

Bar*_*ney 7

document.head.appendChild( linkElement );
Run Code Online (Sandbox Code Playgroud)

... linkElement你的风格链接在哪里.没有人强迫你向身体添加东西,只需将它添加到头部即可.


Tho*_*old 5

链接到正文中的样式表是有效的

stylesheet 关键字可以与链接元素一起使用。此关键字创建一个有助于样式处理模型的外部资源链接。这个关键字身体好。

https://html.spec.whatwg.org/multipage/semantics.html#body-ok https://www.w3.org/TR/html5/links.html#element-statedef-link-stylesheet