这篇文章我们将引见 ASP.NET MVC 的Mobile特征。
你需求先 装置 ASP.NET MVC 4
如今Start。
Step 1: 创立 ASP.NET MVC 4 Web 使用项目
Step 2: 选择项目模板,然后选择 ASPX 或 Razor 作为视图引擎,这里选择 ASPX。
Step 3: 然后编译并在分歧装备上运转使用,你将留意到结构是交互的。
Step 4: 没法在分歧的装备长进行测试,需求下载 FireFox User Agent Switcher
要获得完好的 Agent Switcher 支撑的装备列表,进入 Tools -> Default User Agent -> User Agent Switcher -> Options
点击 Options, 然后你将看到一切的选项
点击 Import 并粘贴下面的 xml 文件 URL 地址,然后点击 OK。
http://techpatterns.com/downloads/firefox/useragentswitcher.xml
你将失掉一切的 User Agent Switcher 列表,如今你可以在分歧操纵系统、装备和阅读器上测试了。
Step 5: 睁开 Views 文件夹,假如你选择了 Razor 作为引擎你看到的是 .cshtml 文件,假如选择的是 ASPX ,看到的是 .aspx 文件。
上图是你选择 Razor 或许 ASPX 的差别。
Step 6: 如今翻开 Scripts 文件夹,你会发明 jquery.mobile-1.0.js 和 jquery.mobile-1.0.min.js.
所运用的 jQuery Mobile 版本是 1.0,今朝最新的是 1.0 ,你可自行下载并交换。
Step 7: 翻开 _Layout.cshtml 或许 Site.master
<!DOCTYPE html> <meta charset="utf-8" />
这里用的是 HTML5
下一项需求看的是
<meta name="viewport" content="width=device-width" />
这个节点的意思是让页面自适应屏幕宽度,你也能够设置实践宽度和高度和缩放级别。
初始的缩放级别应当是 1 .
<meta name="viewport" content="width=device-width, initial-scale=1"/>
Step 8: 如今继续看 _Layout.cshtml.
@Styles.Render("~/Content/mobileCss", "~/Content/css") @Scripts.Render("~/bundles/modernizr") @Scripts.Render("~/bundles/jquery", "~/bundles/jquerymobile") @RenderSection("scripts", required: false) And Site.Master will contain below lines. <%: Styles.Render("~/Content/mobileCss", "~/Content/css") %> <%: Scripts.Render("~/bundles/modernizr") %> <%: Scripts.Render("~/bundles/jquery", "~/bundles/jquerymobile") %>
上面几行加载 css 和 js 文件,这些文件在 BundleConfig.cs 中指定
BundleConfig.cs is 代码大约以下:
2KB项目(www.2kb.com,源码交易平台),提供担保交易、源码交易、虚拟商品、在家创业、在线创业、任务交易、网站设计、软件设计、网络兼职、站长交易、域名交易、链接买卖、网站交易、广告买卖、站长培训、建站美工等服务