Question

如何在同一个HTML页面中使用多个CSS样式表，例如，两个样式表都有一个横幅类。你如何指定你指的是哪个班级？

Answer 1

样式表有效地按照它们在HTML源中出现的顺序连接到单个样式表中。

normal rules for applying rulesets然后应用（例如specificity与最后一个规则集一起定义一个给定的属性在一个平局的情况下获胜并且!important将一个扳手投入作品中）

Answer 2

是的，您可以包含多个样式表，但是您需要将它们标记为备用样式表，并为用户提供一些使用JavaScript激活它们的方法 - 可能是通过单击链接。

要创建备用样式表：

<link type="text/css" href="nameOfAlterateStyleSheet.css" rel="alternate stylesheet" title="Blue" />

接下来在Javascript文件中创建一个方法，该方法将：1。在数组中加载所有样式表2.示例：

function getCSSArray()
{
var links = document.getElementsByTagName("link");
var link;
for(var i = 0; i < links.length; i++)
{
    link = links[i];
    if(/stylesheet/.test(link.rel))
    {
        sheets.push(link);
    }
}

    return sheets;
}

然后使用某种类型的if / else循环遍历数组，该循环禁用您不想要的样式表并启用所需的样式表。（您可以编写单独的方法或将循环插入上面的方法。我喜欢使用onload命令加载页面的CSS数组，然后调用printView方法。）

function printView()
{
var sheet;
var title1 = "printVersion";
for(i = 0; i < sheets.length; i++)
{
    sheet = sheets[i];
            if(sheet.title == title1)
    {
        sheet.disabled = false;
    }
    else
    {
        sheet.disabled = true;
    }

最后，在HTML文档中创建用户将激活JavaScript方法的代码，例如：

 <a href="#" onClick ="methodName();">Link Name</a>

Answer 3

如果规则中specificity的级别相同（例如，两者都只是.banner），则无法控制您引用的内容，最后包含的样式表将获胜。

这是属性，所以如果有一个组合（例如一个有background，另一个有color）那么你将得到组合......如果属性被定义在两者中，无论它是最后一次出现在样式表顺序中的胜利。

Answer 4

你不能也不会。

页面上的所有CSS规则都将被应用（HTML＆＃34;知道＆＃34;没有关于此过程），具有最高特异性的各个规则将会＃34;坚持＆＃34;。特异性由选择器及其在文档中出现的顺序决定。总而言之，这是级联的一部分。你应该参考网上很多CSS教程之一。

Answer 5

您永远不会参考特定的样式表。文档中的所有CSS规则都内部融合为一个。

如果两个样式表中的规则适用于具有相同特异性的相同元素，则稍后嵌入的样式表将覆盖较早的样式表。

您可以使用Firebug之类的元素检查器来查看哪些规则适用，哪些规则被其他规则覆盖。

Answer 6

您最后包含的那个将是使用的那个。但请注意，如果任何规则在第一个样式表中具有重要性，则它们将优先考虑。

Answer 7

将其视为HTML页面中引用（“选择”）元素的样式表，而不是相反。

Answer 8

这是一个简单的选择：

1 /假设我们有两个CSS文件，分别是my1.css和my2.css。在html文档头中，在具有ID的元素中输入指向其中之一的链接，说“ demo”：

2 /在html文档头主体中定义两个调用两个JS函数的按钮：

选择css1
选择css2

3 /最后，在JS文件中，键入以下两个函数：

function select_css1（）{
document.getElementById（“ demo”）。innerHTML =''; }

function select_css2（）{
document.getElementById（“ demo”）。innerHTML =''; }

Answer 9

你不能。您指定的最后一个样式表将是一个html页面将使用的样式表。把它想象成一个单一的.css文件。

在同一个html页面中使用多个css样式表

9 个答案: