MVC3----布局

--------模板(SiteLayout.cshtml)

<html>
<head>
    <title>@ViewBag.Title</title>
</head>
<body>
<h1>我是模板</h1>

<!--继承页面显示内容的部分-->
@RenderBody()

<!--部分渲染(部分模块)-->
<!--RenderSection:flase表示继承此模板的页面可以不用实现Center渲染部分,-->
<h1>中间部分:@RenderSection("Center",false)</h1>
<h1>尾部:@RenderSection("Footer",false)</h1>

<!--表示,如何继承此模板的页面没有实现Footer渲染部分,则使用默认的渲染-->
@if(IsSectionDefined("Footer"))
{
    RenderSection("Footer");
}
else
{
    <span>asdasdasd</span>
}

</body>

</html>

--------继承页面(Array.cshtml)

@{
    //指向模板页
    Layout = "~/Views/SiteLayout.cshtml";
    ViewBag.Title = "Array";
}

<!--实现渲染部分-->
@section Footer{
    sdasdasfasfasf
}

@section Center{
    <span>center</span>
}

--------统一布局配置文件(Views/_ViewStart.cshtml)

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}
时间: 2024-10-05 04:56:14

MVC3----布局的相关文章

ASP.NET MVC3细嚼慢咽---(2)模板页

这一节演示下MVC3中怎样使用模板页,在传统的webform设计模式中,我们使用masterpage作为模板页,在MVC3 razor视图设计中,我们使用另一种方式作为模板页. 新建一个MVC3项目,在解决方案资源管理中,我们可以看到VIEWS文件夹下面有一个Shared文件夹.在Shared文件夹里面有一个_Layout.cshtml页面.这个就是项目中默认的模板页面.如下图 1.新建内容页 内容页在MVC3中也叫做视图布局页,可以右键选中视图文件夹,通过添加视图来添加内容页,然后选择相应的模

ASP.NET MVC3 系列教程 – 新的Layout布局系统

原文地址:http://www.cnblogs.com/highend/archive/2011/04/18/asp_net_mvc3_layout.html I:回忆MVC2当中MasterPage那些事 code: <!------------Begin--------------> <!-- Master文件 --> <%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPa

MVC3/4/5/6 布局页及Razor语法

一.目录结构 二.Razor语法 代码块:@{},如:@{Html.Raw(“”);} @if(){} @switch(){} @for(){} @foreach(){} @while(){} @do{}while(){} 代码块内语句以分号结束 表达式或变量:以@开始,如:@User.Name或@(User.Name + “欢迎你”),@() 变量可以通过var来声明,且只能在代码块中,如:@{var abc=”aaa”;} 方法调用:以@开始,如:@Html.Encode(“”) 单行文本输

ASP.Net MVC 布局页 模板页 使用方法详细说明

一.Views文件夹 -> Shared文件夹下的 _Layout.cshtml 母版页 @RenderBody 当创建基于_Layout.cshtml布局页面的视图时,视图的内容会和布局页面合并,而新创建视图的内容会通过_Layout.cshtml布局页面的@RenderBody()方法呈现在标签之间. @RenderPage从名称可以猜出来这个方法是要呈现一个页面.比如网页中固定的头部可以单独放在一个共享的视图文件中,然后在布局页面中通过这个方法调用,用法如下:@RenderPage(“~/

Asp.Net MVC3.0网站统计登录认证的在线人数

Asp.Net MVC3.0网站统计登录认证的在线人数 前言 对于一个网站来说,统计在线人数是一个很重要的工作.平时也发现很多的网站论坛等都有在线人数的显示.对于一个网站如果在线人数很多,用户看到了这么个数字也是很了不起的事情.由于之前对于这个知识点只是知道,并没有去了解过,这两天偶然的机会又看到了,于是自己整理了一个简单的版本,也方便让大家来给提提意见. 本文主要通过Application和Session全局来统计在线人数,暂时只统计登录验证过的.实现的大致方案如下: 1.在全局应用程序启动的

如何使用Flexbox和CSS Grid,实现高效布局

CSS 浮动属性一直是网站上排列元素的主要方法之一,但是当实现复杂布局时,这种方法不总是那么理想.幸运的是,在现代网页设计时代,使用 Flexbox 和 CSS Grid 来对齐元素,变得相对容易起来. 使用 Flexbox 可以使元素对齐变得容易,因此 Flexbox 已经被广泛使用了. 同时,CSS Grid 布局也为网页设计行业带来了很大的便利.虽然 CSS Grid 布局未被广泛采用,但是浏览器逐渐开始增加对 CSS Grid 布局的支持. 虽然 Flexbox 和 CSS Grid 可

CSS布局技巧大全

参考资料:http://www.imooc.com/article/2235 单列布局 水平居中 父元素text-align:center;子元素:inline-block; 优点:兼容性好: 不足:需要同时设置子元素和父元素 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport"

CSS网页布局

一.主要内容 1.布局分类;131   121 2.display属性排版 3.float属性排版(横向多列布局) 4.防止父类盒子塌陷 二.标准文档流: a>组成 块级元素(block) 内联元素(inline) b>display属性值:block.inline.inline-block.none. 值block:将元素设置为块状元素 值inline:将元素设置为行内元素 值inline-block:拥有两种特性. 补充: visibility:hidden: 属性和 display:no

解决安卓手机键盘弹出时会把背景或百分比定位的布局压缩的问题

做移动端页面时经常遇到以下案例,在有背景的页面上写表单,而且底部为了适应不同手机还得运用绝对定位,因为通常是把容器高度设为了100%,这时在安卓手机上弹窗软键盘时就会把背景图片及其他东西挤压上去,解决方法如下: 在css样式中把大容器定义为fixed布局 .wrap{ position:fixed;left:0;top:0; } 在js中强制把页面的高度覆给他,就相当于自动撑开 var x =document.body.clientWidth; //查询设备的宽度 var y =document

微信小程序页面布局

页面布局: wcml: <view class="page"> <view class="page_hd"> </view> <view class="page_bd"> <view class="section_nav"> <view class="left border_right"> 酒店 </view> <vi