CSS – 类层次结构？

我有一个客户前端的网站,它有一个目录,主页,联系页面,关于我们页面等等.还有一个行政前端.我想实现一种层次结构,其中具有类“admin”的元素中的任何元素将继承在管理样式表中设置的属性以及从客户样式表继承的任何其他内容.这样做的目的是管理员可以在管理员前端登录,他们可以访问许多高级内容,但他们也可以导航到客户前端,在那里他们可以执行基本任务(例如隐藏目录项,运行如果客户报告问题等,则调试脚本).我希望客户前端的所有管理工具都具有从管理样式表而不是客户样式中获取的属性 – 这将改变背景颜色和内容.

是否有任何简单的方法来设置类似名称空间以使事情更简单,例如：

.admin {
    .list {
        .list-subtitle
        {
        }
        .list-item
        {
        }
    }
    a
    {
    }
}
.customer
{
    .list
    {
        .list-subtitle
        {
        }
        .list-item
        {
        }
    }
    a
    {
    }
}

我知道它可能像：

.admin .list {}
.admin .list .list-item {}
.admin a

我只是不想一直把.admin放在上面.

有没有人对我如何做到这一点有任何建议？我想我可以编写一个.net类来设置它并根据输入的内容编写一个样式表,但是我将无法读取样式,因此很容易添加各种类似Classes.Add(blah) ) 等等.

在此先感谢任何回复……

问候,

理查德

<ul class="customer">
    <li>Will appear as a customer control</li>
    <li>Will appear as a customer control</li>
    <li class="admin">Will appear as an admin control</li>
</ul>
<div class="customer">
    <ul class="admin">
        <li>Will appear as an admin control</li>
        <li>Will appear as an admin control</li>
        <li>Will appear as an admin control</li>
    </ul>
</div>

基本上,正如您所看到的,我希望任何具有“admin”类的元素,或者在具有“admin”类的元素内,就像它们在管理前端上一样.否则它们会像客户前端那样出现.这也可能以相反的方式使用,因此管理员可以在将其提交到数据库之前预览他们输入的内容,就像它出现在客户前端一样.

如果在CSS中允许使用名称空间,这将不会有任何问题 – 不幸的是,像Less这样的东西似乎是我唯一可以轻松实现这一目标的选择. (我说不幸的是因为我之前从未使用过它而且我的时间限制非常紧张 – 我没有反对像Less这样的工具！).

问候,

理查德

您是否考虑过使用 Less CSS或 SASS？