2010-10-25 14 views
20

Come posso includere riferimenti CSS solo su determinate pagine del mio sito Web asp.net? Se includo il riferimento nella mia pagina principale, tutte le pagine del sito Web condividono il riferimento CSS.Come includere i CSS nelle pagine master?

risposta

36

Basta aggiungere un CSS ContentPlaceHolder con un valore predefinito in esso.

Fondamentalmente, il file CSS specificato come predefinito verrà incluso a meno che non si sostituisca quel segnaposto con un tag <asp:Content /> da una pagina figlio.

La pagina master dovrebbe essere simile a questa.

<head> 
    <asp:ContentPlaceHolder ID="Stylesheets" runat="server"> 
     <link rel="stylesheet" href="/css/master.css" type="text/css" /> 
    </asp:ContentPlaceHolder> 
</head> 

Poi da tutte le pagine che utilizzano tale pagina master, si può semplicemente ignorare che, con un foglio di stile diverso.

On (esempio) AboutUs.aspx

<asp:Content ID="Content1" ContentPlaceHolderID="Stylesheets" runat="server"> 
    <link rel="stylesheet" href="/css/form.css" type="text/css" /> 
</asp:Content> 
+3

+1 In realtà mi piace questa soluzione meglio del mio suggerimento. L'ho usato prima ed è una buona opzione. Lascerò la mia risposta però, come qualcuno potrebbe trovare utile. –

6

È possibile utilizzare più di una pagina Master sul sito.

È inoltre possibile utilizzare pagine master annidate. Il livello principale potrebbe avere la struttura generale del sito e quindi una pagina principale nidificata principale per ciascuna delle diverse aree.

Quando si fa clic con il pulsante destro del mouse sul progetto e si seleziona Aggiungi, si sceglie l'opzione WebContentForm, anziché WebForm. Quindi puoi selezionare la masterpage appropriata.

Nelle pagine master nidificate, si imposta il MasterPageFile uguale alla pagina principale di livello superiore.

Modifica In combinazione con @ approccio di Marko si potrebbe avere la seguente ...

Il vantaggio è che tutte le sostituzioni hanno solo da scrivere una volta.

primo livello MasterPage:

<head> 
    <asp:ContentPlaceHolder ID="Stylesheets" runat="server"> 
     <link rel="stylesheet" href="/css/default.css" type="text/css" /> 
    </asp:ContentPlaceHolder> 
</head> 

nidificato MasterPage senza esclusione

<%@ Page Language="C#" MasterPageFile="~/Site.master"%> 
//don't reference the Stylesheets ContentPlaceHolder and the default is rendered 

nidificato MasterPage Uno con override.css

<%@ Page Language="C#" MasterPageFile="~/Site.master"%> 
<asp:Content ID="Content1" ContentPlaceHolderID="Stylesheets" runat="server"> 
    <link rel="stylesheet" href="/css/override.css" type="text/css" /> 
</asp:Content> 

nidificato MasterPage Due con secondOverride.css

<%@ Page Language="C#" MasterPageFile="~/Site.master"%> 
<asp:Content ID="Content1" ContentPlaceHolderID="Stylesheets" runat="server"> 
    <link rel="stylesheet" href="/css/secondOverride.css" type="text/css" /> 
</asp:Content> 

Quindi, basta impostare la pagina principale appropriata su uno qualsiasi dei moduli Web.

+0

is'nt Esiste un modo per solo includere il riferimento CSS nella mia pagina, che eredita la pagina principale? –

+0

Sì, vedere la risposta di Marko. Una combinazione dei due approcci potrebbe funzionare perfettamente. –

+0

Utile riferimento Microsoft su pagine master annidate: https://msdn.microsoft.com/en-us/library/x2b3ktt7%28v=vs.140%29.aspx – Roberto

5

Nella mia situazione, ho usato lo stesso masterpage da diverse località della soluzione. E poiché la (Tilde) prefisso ~ sul riferimento ai miei file CSS, ho aggiunto un Response.Write al riferimento in questo modo:

<%= ResolveUrl("~/css/myStyle.css") %> 
+0

grazie, questo ha funzionato per me ma sai che usare <% = ResolveUrl ("~/xxx")%> ha qualche svantaggio? – curiousBoy