MOSS und WSS CSS offenlegen - How to find the right CSS class

Wer sich schon einmal mit dem Branding von SharePoint-Seiten befasst hat, der wird schnell herausgefunden haben, dass es nicht so ganz einfach ist herauszubekommen, welche CSS-Klasse für welches SharePoint-Element zuständig ist.

Um das etwas zu vereinfachen, gibt es 2 sehr schöne Hilfsmittel. Ein kleines Script und die IE-Developer Toolbar von Microsoft.

————————————-

Have you ever struggled to find the right CSS class for your SharePoint branding? Anyone who tried it has surely found it annoying to toggle throug the classes to find the one he needs.

To make things a bit easier there are 2 little helpers. A small script and the IE-Developer tollbar from Microsoft.

Here is the script. You simply have to insert it into a contend editor webpart on your site and move your mouse over the different parts you want to map to a CSS class. I found it somewhere in the MSDN-Library.

<script language=”jscript”>
function ClassInfo()
{
    if (window.event.srcElement.className != null)
    {
        stsclass.innerText = window.event.srcElement.className;
    }
    else
    {
        stsclass.innerText = “”;
    }
}
 
window.document.body.onmouseover = ClassInfo;</script>
 
<div style=”border-style:solid;border-width:1px; width: 281px; height: 34px;
position: absolute; left: 286px; top: 41px; z-index:15; padding-left:4px;
padding-right:4px; padding-top:2px; padding-bottom:2px; background-color:#EEEEF4″>
<p id=”stsclasstitle”><font face=”Tahoma” id=”stsclasstitle”>Classname: </font>
<font face=”Tahoma”id=”stsclass”>&#xa0;</font>
</p></div>

The link to the IE-Developer toolbar ist here.

Dieser Eintrag wurde am 19.8.2008 um 15:41 verfasst und befindet sich in Web, MOSS 2007, SharePoint. Sie können alle Antworten zu diesem Eintrag über den Feed RSS 2.0 mitverfolgen. Hinterlassen Sie eine Antwort oder einen Trackback-Link zu Ihrer eigenen Homepage.

| Drucken