Html 为单个div应用多个类

我已经创建了一个子菜单，我希望div的背景颜色根据子菜单加载的页面而改变

第一个示例（代码用于一页）：

HTML

第二个例子呢

HTML

我将所有具有相似属性的类和其他具有唯一属性的类分组。但是这个代码根本不起作用。 有人知道我在哪里搞砸了吗

---

谢谢

你的css类名是错误的，它们应该是

.leftYH、.rightYH、.cellYH

你有小写的h

更新

您还需要将

宽度：50%

仅应用于您的

.left

类，并且您缺少

cellYH的

查看下面的示例

css

将第37行更改为
.leftYH、.rightYH、.cellYH
（小写H，在cellYH之前缺少
）
从多个CSS类继承有两种方法~


多类样式：这表示所有类都获得以下属性

 left a, .right a, .cell a{
       ....

 }


多类元素：您可以将多个类应用于任何html标记，如

<a class="left right cell>

请在此处发布您的代码。您可以使用脚本根据我在此处阅读的内容动态重新分配类。。虽然没有代码很难帮助…有人试图将代码编辑到问题中，但国防部拒绝了。为什么？如果没有代码，你无法链接到小提琴。。不要曲解规则，遵守它们……非常感谢，当你带着一个想法坐到深夜时就会发生这种情况：P
<div class="tablecontainer">
    <div class="left leftYH">
        <p><a href="#">Link1</a></p>
    </div>
        <div class="right rightYH">
        <p><a href="#">Link2</a></p>
    </div><div class="left leftYH">
        <p><a href="#">Link3</a></p>
    </div>
    <div class="right rightYH">
        <p><a href="#">Link4</a></p>
    </div>
    <div class="cell cellYH">
        <p><a href="#">Link5</a></p>
    </div>    
</div>

.tablecontainter{
    width:100%;
}
.left{
    float: left;
}
.left, .right{  
    width: 50%;
    margin-bottom: 1px;
    padding-right: 5px;
    padding-left: 5px;
    border: 1px;
    border-style: solid;
    border-color: white;
    text-align: center;
}
.cell{
    width: 100%;
    margin-bottom: 1px;
    border: 1px;
    border-style: solid;
    border-color: white;
    text-align: center; 
}
.left a, .right a, .cell a{
    text-decoration: none;
    color: #fff;
    font-size: 1em;
}
.leftYh, .rightYh, cellYH{
    background-color: #660066;  
}

.tablecontainer{
    width:100%
}
.left, .right{
    margin-bottom: 1px;
    padding-right: 5px;
    padding-left: 5px;
    border: 1px;
    border-style: solid;
    border-color: white;
    text-align: center;
}
.left{
    width: 50%;
    float: left;
}
.cell{
    width: 100%;
    margin-bottom: 1px;
    border: 1px;
    border-style: solid;
    border-color: white;
    text-align: center; 
}
.left a, .right a, .cell a{
    text-decoration: none;
    color: #fff;
    font-size: 1em;
}
.leftYH, .rightYH, .cellYH{
    background-color: #660066;
}

 left a, .right a, .cell a{
       ....

 }

<a class="left right cell>