Hoi,
Ik ben nieuw in het gebruik van MVC 5 in combinatie met de Bootstrap layout / ui. Ik zit te worstelen met het maken van een mooie Home pagina.
Als ik het goed begrijp zit de hoofd layout van de website in the _Layout.cshtml view. Die view bevat een RenderBody commando waar dan de view van alle "sub paginas" in geplakt wordt:
Deze RenderBody zit dus binnen het 'container body-content' element, welke een margin en maximale breedte aan de pagina geeft.
Nu wil ik deze margin en maximale breedte eigenlijk weg hebben maar dan enkel voor mijn Home pagina. Voor alle content pagina's is dit prima, maar in de Home pagina wil ik graag een afbeelding (net onder de navbar) die de hele pagina beslaat.
De CSS die daarvoor moet zorgen krijg ik waarschijnlijk zelf wel voor elkaar, maar het probleem is dat alles wat ik in de Home view stop binnen de body-content tag komt, en dus altijd die margin krijgt.
Mijn vraag is dus: hoe kan ik de Home pagina nou aanpassen zodat een gedeelte ervan buiten die body-content div geplaatst wordt?
Het resultaat moet dus zoiets worden:
Hier moet @RenderHomeImage dus iets zijn wat mijn afbeelding html plaatst, terwijl RenderBody gewoon de rest van de home pagina en alle andere pagina's op de normale manier plaatst.
De enige manier die ik kan bedenken is om de RenderBody buiten de body-content div te plaatsen, en de body-content div daarna in elke sub pagina te plaatsen. Maar dat wil ik eigenlijk niet natuurlijk, dan moet ik alle views gaan aanpassen en daar ook steeds aan denken bij elke nieuwe view.... Dit moet toch wel makkelijker kunnen?
Bedankt..
Ik ben nieuw in het gebruik van MVC 5 in combinatie met de Bootstrap layout / ui. Ik zit te worstelen met het maken van een mooie Home pagina.
Als ik het goed begrijp zit de hoofd layout van de website in the _Layout.cshtml view. Die view bevat een RenderBody commando waar dan de view van alle "sub paginas" in geplakt wordt:
code:
1
2
3
4
5
6
7
| <div class="container body-content">
@RenderBody()
<hr />
<footer>
<p>© @DateTime.Now.Year - Blaat</p>
</footer>
</div> |
Deze RenderBody zit dus binnen het 'container body-content' element, welke een margin en maximale breedte aan de pagina geeft.
Nu wil ik deze margin en maximale breedte eigenlijk weg hebben maar dan enkel voor mijn Home pagina. Voor alle content pagina's is dit prima, maar in de Home pagina wil ik graag een afbeelding (net onder de navbar) die de hele pagina beslaat.
De CSS die daarvoor moet zorgen krijg ik waarschijnlijk zelf wel voor elkaar, maar het probleem is dat alles wat ik in de Home view stop binnen de body-content tag komt, en dus altijd die margin krijgt.
Mijn vraag is dus: hoe kan ik de Home pagina nou aanpassen zodat een gedeelte ervan buiten die body-content div geplaatst wordt?
Het resultaat moet dus zoiets worden:
code:
1
2
3
4
5
6
7
8
| @RenderHomeImage()
<div class="container body-content">
@RenderBody()
<hr />
<footer>
<p>© @DateTime.Now.Year - Blaat</p>
</footer>
</div> |
Hier moet @RenderHomeImage dus iets zijn wat mijn afbeelding html plaatst, terwijl RenderBody gewoon de rest van de home pagina en alle andere pagina's op de normale manier plaatst.
De enige manier die ik kan bedenken is om de RenderBody buiten de body-content div te plaatsen, en de body-content div daarna in elke sub pagina te plaatsen. Maar dat wil ik eigenlijk niet natuurlijk, dan moet ik alle views gaan aanpassen en daar ook steeds aan denken bij elke nieuwe view.... Dit moet toch wel makkelijker kunnen?
Bedankt..