如何避免css类名的名称冲突

Question

我正在使用雅虎的PURE类PURE写一个网页。 详细地说，它实际上不是一个独立的网页，而是某个网站的网页的一部分。我与运营该网站的公司没有联系。

当我测试我的部分作为一个独立的网页时，它看起来很好。虽然当我在父网页中测试该部分时，我注意到css根本不起作用。

我可以假设错误的唯一原因是名称冲突。例如，我的部分使用PURE中定义的类“header”。我猜这个类名是由父网页的程序员使用的。

如果我的假设是正确的，你能否帮我避免css类名的名称冲突。

Answer 1

为此目的，请考虑使用BEM方法（尝试阅读此http://getbem.com/introduction/）。

我们假设您根据需要调用您的应用（或小部件或网站）MyPersonalApp。相应地命名您的类，如下例所示：

<div class="MyPersonalApp">
    <div class="MyPersonalApp__container">
        <p class="MyPersonalApp__text">
            Hello world.
        </p>
    </div>
</div>

但是，此代码不会确保您与父网站发生冲突，因此请尽量选择唯一名称。当我编写小部件或嵌入式应用程序时，我尝试选择EmbeddedChatWidgetBySomeCompany之类的名称并故意使用驼峰套管 - 因为这通常不是开发人员用于其类名的内容。