两个不同设置的html css文件_Html_Css

两个不同设置的html css文件

html css

两个不同设置的html css文件,html,css,Html,Css,我有两个样式表和一个html页面。我可以在页面中央的div中使用其中一个样式表吗？我想这样做，因为这两种样式对h1、h2、th等都有不同的设置。

我有两个样式表和一个html页面。我可以在页面中央的div中使用其中一个样式表吗？我想这样做，因为这两种样式对h1、h2、th等都有不同的设置。

这将允许您有一个只应用于文档部分的

元素（而不是外部样式表的

）

h1 { 
    color: red;
}

#mySection h1 {
    color: black;
}

浏览器支持很弱（我得到的最新数据来自），所以这几乎肯定不适合你

通常的解决方案是使用单个样式表。将文档的部分包装在具有

id

的元素中，并在选择器中使用该id以覆盖更广泛文档中的所有适用样式

h1 { 
    color: red;
}

#mySection h1 {
    color: black;
}

特异性将决定哪个优先。如果您选择这样做，您可以添加类来区分H1的一种样式或另一种样式

但是，通过HTTP加载两个CSS文档也会对性能造成影响

就我个人而言，我会在一个文档中按类列出我的风格。例如：

h1 {
    color:orange;
}

.style1 h1 {
    font-size: 600%;
    color: red;
}

.style2 h1 {
    font-size: 20%;
    color: yellow;
}

关键是保持简单。想想如果你的网站变得非常庞大，那么你的方法在长期内的可维护性会有多高。

你可以访问标题，例如在div中，如果你有以下内容：

<div class="example">
    <h1>Fancy headline</h1>
</div>


花哨的标题

您可以使用类似.example h1{…}的样式来仅为该标题指定特定样式。这就是css中的级联；）

而不是试图指定HTML的哪个部分将使用哪个样式表在样式表中更具体，这样您就不会遇到样式冲突。榜样

HTML:

您可以使用任意多的样式表。但是最好将所有样式合并到一个工作表中，这样页面就不必从Web服务器请求多个文件

但更重要的是：如何在页面上对相同的元素进行不同的样式设置

有两种方法：

1）通过使用

class

或

id

。如果您有一个标签

和

，则可以对它们进行不同的样式设置

.regular {
color: #000000;
}
.highlight {
color: #0000ff;
}

2）您还可以根据它们与其他元素的关联来设置样式。例如，如果页面结构为：

<body>
    <div class='lvl-one'>
        <p class='lvl-two'></p>
    </div>
</body>

另外，你的页面上不应该有多个

h1

标签——这对搜索引擎优化不利。

你不应该这样做。这就是为什么你要上课。哪种样式表会成为先例？如前所述，只需使用类。似乎您希望对元素进行分类，并将css应用于这些类。如果您有两个CSS页面，第二个页面将覆盖第一个页面的CSS，如果它们重叠。

<body>
    <div class='lvl-one'>
        <p class='lvl-two'></p>
    </div>
</body>

div p {
    font-size:24px;
}