Stilbiblioteket innehåller CSS-filer, XSL-filer (Extensible Stylesheet Language) och bilder som används av fördefinierade mallsidor, sidlayouter och kontroller i SharePoint 2010.
Så här hittar du CSS-filer i stilbiblioteket på en publiceringswebbplats:
Välj Webbplatsåtgärder→ Visa allt webbplatsinnehåll.
Innehållet på webbplatsen visas. Stilbiblioteket finns i avsnittet Dokumentbibliotek.
Klicka på länken Stilbibliotek.
Flera mappar visas i Style-biblioteket, inklusive en-us (för amerikansk engelska) och Images.
Klicka på mappen sv-us (eller annan språkmapp).
Andra mappar dyker upp, inklusive kärnstilar och temabara, som innehåller fördefinierade stilar. Om du gör anpassade stilar för ett varumärkesarbete, skapa en mapp under en-us för att innehålla dina anpassade stilar för den webbplatsen, så att de är på en bekant plats. Men du skapar vanligtvis den mappen och dess filer i SharePoint Designer snarare än i webbläsaren.
Se de olika CSS-filerna i mappen.
Även om dessa filer kan öppnas med SharePoint Designer 2010 om du har det installerat, gör inte detta om du inte är bekant med den produkten. Se steg 5 för ett alternativt sätt att visa innehållet i en CSS-fil.
För att se innehållet i en fil, klicka på fliken Bibliotek på menyfliksområdet under Biblioteksverktyg och klicka sedan på alternativet Öppna med Utforskaren.
Filerna visas i ett mappfönster. Du kan högerklicka och välja Öppna med anteckningar för att se innehållet. Redigera inte dessa filer, men du kan kopiera och klistra in innehållet i din egen Anteckningsblock-fil för granskning.
Stäng mappfönstret när du är klar.
Återigen, du kommer att upptäcka att det är bäst att inte ändra de fördefinierade SharePoint-stilarna. Kom ihåg att du kan åsidosätta dessa stilar i din alternativa stilmall, i länkade stilar eller inbäddade i dina anpassade filer.
CSS-webbkontroller i SharePoint
Webbserverkontroller är ansvariga för att hantera och rendera CSS-fillänkar och stilmallar. Som standard finns webbserverkontrollerna på SharePoints huvudsidor. För att hitta mallsidor, titta i Master Page and Page Layout Gallery, eller, i SharePoint Foundation, i masterpages-galleriet. Den relativa sökvägen till galleriet är /_catalogs/masterpage/Forms/AllItems.aspx.
Hitta huvudsidan
För att undersöka CSS-webbserverkontrollerna i SharePoint måste du få en kopia av huvudsidan som används på webbplatsen. Men för att ladda ner en kopia av huvudsidan för din webbplats måste du veta vilken huvudsida din webbplats använder.
Använd ett eller flera av följande för att avgöra vilken huvudsida din webbplats använder:
-
På en SharePoint Server 2010-webbplats där publiceringsfunktioner är aktiverade och aktiverade, gå till sidan Inställningar för webbplatsens huvudsida via Webbplatsåtgärder, länken .Master Page avsnittet, klicka på Utseende och känsla. Sedan, under Inställningar, Webbplats
-
Istället för att använda menyn för att hitta sidan Inställningar för webbplatsens huvudsida, lägg till följande URL-kodavsnitt i slutet av serveradressen för din webbplats: /_layouts/ChangeSiteMasterPage.aspx; till exempel https://contoso.com/\_ layouts/ChangeSiteMasterPage.aspx
-
På en SharePoint Foundation-webbplats kan du använda Windows PowerShell för att avgöra vilken huvudsida webbplatsen använder, som visas i figur 4. Följande är ett exempelskript.
PowerShell
$web = get-spweb("https://contoso.com");$web.masterurl
Figur 4. v4.master på en SharePoint-teamwebbplats
Tabell 4 listar alla webbserverkontroller som är relaterade till CSS och som är tillgängliga i SharePoint Server. Du kan hitta dessa kontroller i namnområdet Microsoft.SharePoint.WebControls, som är en del av Microsoft.SharePoint.dll-sammansättningen.
Tabell 4. CSS-webbserverkontroller i SharePoint 2010
Utöka tabellen
Kontrollera
|
Beskrivning
|
Hitta kontrollen i . . .
|
CSSLink
|
<SharePoint:CssLink runat="server" Version="4"/>
|
Master Pages
|
Tema
|
<SharePoint:Theme runat="server"/>
|
Master Pages
|
CSSregistrering
|
<SharePoint:CssRegistration Name="minimalv4.css" runat="server" />
|
Huvudsidor, sidlayouter
|
Följande avsnitt beskriver varje kontroll som är listad i Tabell 4 och sammanfattar fördelarna med var och en.
CSSLink
CSSLink-webbkontrollen finns i SharePoint-huvudsidor och är ansvarig för att återge HTML-koden <LINK> element. CSSLink-kontrollen fungerar med CSSRegistration-kontrollerna. Om det finns CSSRegistration-kontroller på sidan, registrerar CSSLink-kontrollen och återger de ytterligare CSS-filreferenser som registreringskontrollen gör.
CSSLink-kontrollen har följande medlemmar:
-
UIVersion (valfritt) — Låter webbplatsägare ändra utseendet och känslan för en uppgraderad eller migrerad SharePoint-webbplats. Aktiverar förhandsgranskning av webbplatsen i SharePoint-användargränssnittet eller Microsoft Office SharePoint Server (MOSS) 2007-användargränssnittet. Ställ in värdet på 4 för SharePoint och ställ in det på 3 för MOSS 2007-webbplatser.
-
Version (tillval) — Åsidosätter kontrollversionen av SPControl-klassen.
-
Alternativ (valfritt) — Flaggar om kärn-CSS (Core.css eller Corev4.css) renderas med andra CSS-filreferenser, eller om en alternativ CSS renderas. Standardvärdet är False, vilket anger att core css-filen (core.css eller corev4.css) renderas.
-
DefaultUrl (valfritt) — Ställer in eller hämtar standardwebbadressen som används för CSS-filen.
Följande exempel visar hur denna kontroll kan återges.
HTML
<länk rel="stylesheet" type="text/css" href="/_layouts/1033/styles/Themable/search.css?rev=Uoc0fsLIo87aYwT%2FGX5UPw%3D%3D"/> <länk rel="stylesheet" type="text/css" href="/_layouts/1033/styles/Themable/wiki.css?rev=9pXM9jgtUVYAHk21JOAbIw%3D%3D"/> <länk rel="stylesheet" type="text/css" href="/_layouts/1033/styles/Themable/corev4.css?rev=iIikGkMuXBs8CWzKDAyjsQ%3D%3D"/>
CSSLink-kontrollen lägger till en ?rev= frågesträngsparameter till filreferensen för att kontrollera webbläsarens cachelagring och för att tvinga webbläsaren att ta en ny kopia av filen.
CSSLink-kontrollen är också ansvarig för de beteenden som beskrivs i följande avsnitt.
CSSregistrering
Webbkontrollen CSSRegistration används med CSSLink-kontrollen för att registrera CSS-filer så att de kan renderas på sidan. Registrera CSS-filer efter relativ eller statisk URL.
CSSRegistration-kontrollen har följande medlemmar:
-
Namn (obligatoriskt) — Filnamnet som ska registreras. Om namnet inte anges skickar SharePoint felet som visas i figur 5. Värdet på Name-egenskapen ska vara ett filnamn eller en URL. Om ett filnamn används måste CSS-filen finnas i mappen LAYOUTS Style.
Följande exempel visar hur du använder filen custom.css som hänvisades till ovan och som distribuerades till mappen Styles (C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\MALL\LAYOUTS\{Locale- ID}\STYLES).
XAML
<SharePoint:CssRegistration runat="server" Name="custom.css" />
Följande exempel visar hur CSSLink-kontrollen återger custom.css-registreringen.
HTML
<länk rel="stylesheet" type="text/css" href="/_layouts/1033/styles/custom.css?rev=pFayZ3XaoWhaMymtxOLHNA%3D%3D"/>
Förutom att referera till en fil som finns i katalogen LAYOUTS\{Locale ID}\Styles, kan du registrera en fil genom att använda en URL. Ange en enda URL i egenskapen Name genom att använda tokens. Några välkända URL-tokens är: ~webbplats, ~webbplatssamling och ~språk. Använd dessa tokens tillsammans med en uttrycksbyggare, som SPURl. ~språktoken mappar till en språkkultursträng, till exempel en-us.
Lägger till en post som liknar följande exempel...
XAML
<SharePoint:CssRegistration Name="<%$ SPURl:~sitecollection/Style Library/~language/Custom/2ndcustom.css %>" runat="server" />
…genererar följande HTML, som visas i figur 5.
HTML
<länk rel="stylesheet" type="text/css" href="/Style%20Library/en-US/Custom/2ndcustom.css"/>
Figur 5. SharePoint-sidafel
-
Efter (valfritt) — Anger renderingsordningen för CSS-filen som du registrerar. Om du till exempel vill rendera en anpassad stilmall som heter custom.css efter core4.css, använder du följande kod för att konfigurera registreringskontrollen.
XAML
<SharePoint:CssRegistration Name="<%$ SPURl:~sitecollection/Style Library/~language/Custom/2ndcustom.css %>" runat="server" Efter="core4.css" />
Om du gör detta tvingar webbkontrollen CSSLink att rendera din anpassade fil efter fillänken core4.css.
HTML
<länk rel="stylesheet" type="text/css" href="/_layouts/1033/styles/Themable/corev4.css?rev=iIikGkMuXBs8CWzKDAyjsQ%3D%3D"/> <länk rel="stylesheet" type="text/css" href="/Style%20Library/en-US/Custom/2ndcustom.css"/>
Notera
Du kan endast använda uttrycksbyggaren SPURl på SharePoint Server-webbplatser; det är inte tillgängligt i SharePoint Foundation.
-
EnableCSSTheming – flaggar om du vill att dina stilmallar ska vara temanbara, vilket innebär att de kan tillämpas som en del av anpassade SharePoint-teman.
-
Ställ in egenskapen EnableCSSTheming för CSSRegistration-kontrollen till true.
-
Lägg till temankommentarer till dina CSS-stilklasser. För att se några exempel, granska Themable katalogen som är installerad med SharePoint (C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14 \MALL\LAYOUTS\{Locale-ID}\STYLES\Themable).
Följande exempel visar ms-toolbar CSS-klassen i thetheable Corev4.css. Om du tillämpar ett tema, varje gång som klassen ms-toolbar används, ersätter temat färgen #0072BC med Hyperlink-temafärgen som definieras i själva temat.
.ms-toolbar{ font-family:verdana; font-size:8pt; text-dekoration:ingen; /* [ReplaceColor(themeColor:"Hyperlink")] */ color:#0072BC; }
-
ConditionalExpression — Används för att ange om denna stilmall ska tillämpas för en specifik webbläsarversion. Till exempel anger värdet IE 9.0 att registreringen tillämpas för Internet Explorer version 9.0. CSSLink-kontrollen känner av värdet.
Tema
Theme webbserverkontrollen tillämpar ett tema på en SharePoint-webbplats. Det finns flera tillgängliga verktyg som du kan använda för att skapa teman; till exempel Theme Builder på Microsoft Connect. När du har skapat ett tema (.thmx-filer) laddar du upp det till Teman galleriet, som finns på sidan Inställningar (/_catalogs/theme/ Forms/AllItems.aspx). För att tillämpa ett tema, gå till sidan Webbplatstema (/_layouts/themeweb.aspx).
Följande är ett exempel.
HTML
<länk rel="stylesheet" type="text/css" href="/_catalogs/theme/Themed/54E2D43/search-7E1AFF02.css?ctag=1"/> <länk rel="stylesheet" type="text/css" href="/_catalogs/theme/Themed/54E2D43/wiki-ECF524AA.css?ctag=1"/> <länk rel="stylesheet" type="text/css" href="/_catalogs/theme/Themed/54E2D43/corev4-8A0ABD2F.css?ctag=1"/>
När du använder ett tema skapar SharePoint en ny temamapp som innehåller alla CSS- och bildfiler som krävs för att rendera temat. Den nya temamappen visas inte i Webbplatsinställningar eller i Visa allt innehåll. Genom att använda SharePoint Designer kan du visa temafiler, som visas i figur 6.
Figur 6. SharePoint-teman