在Webpart中覆盖SharePoint CSS类名称

StackOverflow https://stackoverflow.com/questions/3971624

题

我一直在高低寻找令人满意的答案，并失败了。我希望Stackoverflow可以为我提供！

我正在使用SharePoint Foundation 2010（我的第一次真正尝试深入SharePoint），（除其他外）是自定义的Web部件；该站点的主页使用客户端提供的CSS文件以及我必须遵守的CSS文件。我遇到的问题是，SharePoint通过将几个特定于SharePoint特定的CSS类添加到Web Part HTML结构中，与客户的样式相抵触。挖掘后，我发现 ms-WPBody 班级及其各种元素选择器是主要罪魁祸首。

我可以添加 !important 对于客户端样式表中的所有内容，但这就是verboten。我可以将一些非常混乱的样式插入网络部分的儿童内容中，以试图覆盖SharePoint的样式，这是我最近一直在追求的课程，但它越来越混乱。或者，我可以尝试从网络部分中删除课程，这使我提出了我的问题：

如何 我可以删除或以其他方式覆盖SharePoint Web部件的HTML结构中插入的CSS类名称吗？我对SharePoint的内部工作不太了解，无法知道该如何进行这种更改，而我的Google-Fu在这个主题上失败了。 CssClass 在ASP.NET上，Web控制标记显然被忽略了，可能是从 WebControl.

帮我stackoverflow！你是我唯一的希望！

编辑
我很抱歉以前没有明确说明，但我想声明我掌握了CSS，并且没有在寻找造型方面的帮助。我真正寻找的是如何删除SharePoint发出的CSS类。谁能在那里帮忙吗？我将删除CSS标签，因为这似乎使人感到困惑。这个问题实际上与CSS无关，而与SharePoint有关。

有帮助吗？

解决方案

CSS必须匹配它应用于 - 使用SharePoint（或标准ASP.NET WebForms）所产生的HTML所应用的HTML，通常更容易修改CSS。如果添加重要的不是一个选项，则通常可以使用更具体的选择器来做某事 - 即定义为“表TD”的样式将覆盖“ TD”，尽管它们实际上选择了所有相同的元素。您可以使用这种方法来撤消任何是Causign问题的SharePoint样式。

如果您真的想更改页面上的SharePoint投入的类，请使用jQuery-尝试执行该服务器端的确不是您想要在第一个SharePoint项目中进入的东西。

其他提示

我不确定我是否关注，但是为什么不将您的webpart包裹在容器div中，然后将您的内心化合物置于您的内心：

<style type="text/css">
.ms-WPBody {
background-color:red;
}

#myCustomCss p
{
    background-color:Blue;
}

</style>
<div class=ms-WPBody>
<div id=MyCustomCSS>
<p>Hello world</p>
</div>
</div>

在2007年，我们不得不担心确保您的样式表被字母顺序命名，以便正确应用它。将CSS文件的前缀带有Z，以查看是否有帮助。

这是有关此问题的参考文章：http://singchan.com/2009/12/29/branding-sharepoint-2010-collaboration-sites-sites-part-part-2-in-a-a-series/

这是一些典型的Web Part HTML：

<div style=""
    allowexport="false"
    allowdelete="false"
    class="ms-WPBody ms-wpContentDivSpace"
    width="100%"
    id="WebPartctl00_m_g_d0420a1c_44b7_4009_81c9_2bbcf9b325e9"
    haspers="false"
    webpartid="d0420a1c-44b7-4009-81c9-2bbcf9b325e9">
    <div id="ctl00_m_g_d0420a1c_44b7_4009_81c9_2bbcf9b325e9">
        Web Part Content goes here...
    </div>
</div>

诀窍是，网络部分本身就是内部的div（及其所有孩子）。外部DIV（带有MS-WP Body类的一个）是 Webpartzone. 。该控件已密封，但是您可以编写一个适配器，该适配器可以根据需要呈现Webpartzone。大部分的 例子 用于无桌的渲染，您可以编写一个维护现有结构但要删除类的渲染。

对我来说，对所有这些编码，然后在compat中注册它。Web应用程序的App_Browsers的浏览器似乎是Overkill的，所以我可能会选择JQuery（但是如果您进行适配器，我会看到它）。

或者只需添加内容编辑器Web零件，然后覆盖HTML中的CSS样式元素：

<style type="text/css">
.ms-stylebox {
 border:o important;
}
</style>

- 和平！

您如何加载CSS文件？如果要在主页面的一部分中加载它，或者仅通过设置Custom.css，则可以尝试将其加载到头部外。这应该使其在core.css之后加载，因此允许您根据需要覆盖标准类。

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top