Question

我试图将h1标签设为两种颜色，例如在＆＃34;主页＆＃34; h1是红色的，在＆＃34;辅助页面中＃34; h1是蓝色的。

我试图在没有成功的情况下实现这一目标，我一直在做这个跨度，但我想知道是否有另一种方法可以做到这一点。

这是我的代码结构

h1, h2, h3, h4, h5, p, li, ul, ol, a, a:hover, button { color: red; }

h1 .h1cor{
   color: blue;
}

Answer 1

每个页面会在页面中抛出唯一的类或 id ，将页面的类或ID作为对样式 h1 标记的引用; 例如;

<body class="page-class">

.page-class h1{
    color:blue;
 }

Answer 2

您可以使用以下ID进行此操作：

#secundarypage h1{
color:red;
}

#mainpage h1{
color:blue;
}

<div id="mainpage">
  <h1>Heading for mainpage</h1>
</div>

<div id="secundarypage">
  <h1>Heading for secundary page</h1>
</div>

Answer 3

首先使用此

获取您当前所在的页面名称

var url = window.location.href
 var getLink = url.split("/").pop();

然后根据页面名称设置颜色

if(getLink == 'mainPage'){
  $('h1').css("color","red");
}else if(getLink == 'secondary page'){
  $('h1').css("color","yellow");
}