2012-05-03 1 views
7

Ho una pagina di layout questa convenzioneMVC3 - link 'elemento '' non può essere nidificato all'interno dell'elemento 'link'' - si cerca di aggiungere pagina specifica CSS

<!DOCTYPE html> 
<html> 
<head> 
    <title>@ViewBag.Title</title> 
    <script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script> 
    <link href="@Url.Content("~/content/main_layout.css")" rel="stylesheet" type="text/css" /> 
    <link href="@Url.Content("~/content/menu.css")" rel="stylesheet" type="text/css" /> 
    @RenderSection("JS", required:false) 
    @RenderSection("CSS", required:false) 
</head> 
<body> 
    @RenderBody() 
</body> 
</html> 

E poi una vista come modo

@{ 
    ViewBag.Title = "Home"; 
    Layout = "~/views/shared/_layout.cshtml"; 
} 
@using RS.Common.HtmlHelpers; 
@section JS 
{ 
    <script src="@Url.Content("~/scripts/fue.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/scripts/jquery.flexslider-min.js")" type="text/javascript"></script> 
} 
@section CSS 
{ 
    <link href="@Url.Content("~/content/hp.css")" rel="stylesheet" type="text/css" /> 
    <link href="@Url.Content("~/content/hp_form.css")" rel="stylesheet" type="text/css" /> 
    <link href="@Url.Content("~/content/flexslider.css")" rel="stylesheet" type="text/css" /> 
} 

<h4>Test!</h4> 

La pagina si carica bene come mi aspetto. Tuttavia, io sono sempre 3 avvertimenti:

Validation (XHTML 1.0 Transitional): Element 'link' cannot be nested within element 'link' 

questo errore, uno per ciascuno dei tag nella sezione CSS sulla vista.

In questo stadio è solo un fastidio, ma mi sono chiesto quale sia la causa (e quindi la soluzione) di questo errore?

risposta

9

È stato specificato HTML5 DOCTYPE eppure si sta tentando di convalidare come XHTML 1.0 Transitional. Suppongo che il codice HTML rendering finale è simile al seguente:

<!DOCTYPE html> 
<html> 
<head> 
    <title>Home</title> 
    <script src="/Scripts/jquery-1.7.1.min.js" type="text/javascript"></script> 
    <link href="/content/main_layout.css" rel="stylesheet" type="text/css" /> 
    <link href="/content/menu.css" rel="stylesheet" type="text/css" /> 

    <script src="/scripts/fue.js" type="text/javascript"></script> 
    <script src="/scripts/jquery.flexslider-min.js" type="text/javascript"></script> 

    <link href="/content/hp.css" rel="stylesheet" type="text/css" /> 
    <link href="/content/hp_form.css" rel="stylesheet" type="text/css" /> 
    <link href="/content/flexslider.css" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
    <h4>Test!</h4> 
</body> 
</html> 

si potrebbe desiderare di invertire l'ordine delle due RenderSection nel layout in modo che i collegamenti e gli script sono raggruppati insieme. Oppure si potrebbe anche prendere in considerazione lo spostamento delle dichiarazioni di script alla fine della pagina:

Ti piace questa:

<!DOCTYPE html> 
<html> 
<head> 
    <title>@ViewBag.Title</title> 
    <link href="@Url.Content("~/content/main_layout.css")" rel="stylesheet" type="text/css" /> 
    <link href="@Url.Content("~/content/menu.css")" rel="stylesheet" type="text/css" /> 
    @RenderSection("CSS", required:false) 
</head> 
<body> 
    @RenderBody() 

    <script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script> 
    @RenderSection("JS", required:false) 
</body> 
</html> 
+0

Questo è davvero il motivo e il layout sembra molto più chiara, anche. Grazie ancora, Darin. – glosrob