2017-05-23 1 views
0

So eine Ansicht, die ich habe, die ein Layout verwendet, und ich wollte für ihn nur die CSS für Körper verändern, und ich auf dieser Lösung gestolpert:Wie Viewdata verwenden CSS für eine bestimmte Ansicht zu ändern

Top meiner Ansicht:

@{ 
    ViewData["PageId"] = "Login"; 
} 

Css:

body#Login { 
    padding-top: 0; 
    background: #000428; 
    background: -webkit-linear-gradient(to left, #004e92, #000428); 
    background: linear-gradient(to left, #004e92, #000428); 
} 

Aber als ich entschied, ich wollte auch die CSS für die hTML ändern, es hat nicht funktioniert?

html#Login { 
    overflow-y: auto; 
} 

Kann jemand erklären, wie das funktioniert auch, und warum kann es keinen Raum sein zwischen body und #Login

Antwort

0

Ihre Wähler erfordert die body Tag eine Id, die genannt Login wie folgt aus:

<body id="Login"> 
    This is the Target Element of your Selector 
</body> 

Also, wenn der Körper diese ID nicht hat, stimmte der Selektor nicht überein. Ein nicht-passendes Beispiel dieser sein könnte:

<body> 
    This element has no Id called Login and so Css wouldn't apply 
</body> 

Sie die body mit zusätzlichen Code überschreiben könnte, das ist richtig. Aber bedenke, dass die Reihenfolge in CSS wichtig ist! Sie müssen also Ihren zweiten Code nach dem ursprünglichen CSS-Code hinzufügen, den Sie überschreiben möchten. Wenn die CSS in der _Layout-Datei geladen wird, können Sie einen Abschnitt zum Beispiel verwenden, um sicherzustellen, dass es nach angewandt wird das gemeinsame CSS es zu überschreiben:

<link rel="stylesheet" rel="css/master-shared-stylesheet.css"> 
@RenderSection("AdditionalPageCss") 

Dann können Sie so etwas wie dies in der tun Ansicht, wo Sie wollen master-shared-stylesheet.css zu überschreiben:

@section AdditionalPageCss { 
    <style type="text/css"> 
     /* Overwrite */ 
     body { 
      overflow-y: auto; 
     } 
    </style> 
} 
+0

ich bin nicht sicher, dass wir einander verstehen, wenn ich einfach schreiben 'body' als die CSS wird auf jeder Ansicht angewendet werden, die das Layout verwendet. Ich möchte css für den Körper nur für die Login-Ansicht anwenden, und das habe ich tatsächlich mit "body # Login" erreicht - das funktioniert, aber es funktioniert nicht für die html css –

+0

aktualisiert, um klarer zu sein. Denken Sie daran, dass Ihr Code nur funktioniert, wenn "body" eine ID namens "Login" hat. Sie benötigen dazu eine Art globale Variable wie 'ViewBag.BodyId'. – Lion

+0

Ich glaube ich verstehe jetzt Danke: D Kannst du auch erklären warum es 'body # Login' geschrieben hat und nicht' body # Login'? –

Verwandte Themen