asp.net 页面,文字自适应手机屏幕
width - viewport的宽度 height - viewport的高度
initial-scale - 初始的缩放比例
minimum-scale - 允许用户缩放到的最小比例
maximum-scale - 允许用户缩放到的最大比例
user-scalable - 用户是否可以手动缩放
(2)Asp.Net MVC 从第四版开始就支持移动端了。通过设置HttpContext.Cahce和HttpContext.Items来调整需要输出设别的现实模式,通过DisplayModel自动识别当前设备是PC端还是Mobile端。PC意是指电脑端,Mobile可以是安卓,塞班,苹果或者已经被淘汰的WinPhone.
当调用ViewResultBase的ExecuteResult函数寻找ViewEngineResult的时候,VirtualPathProviderViewEngine调用FindView 。
代码如下:IEnumerable<IDisplayMode> possibleDisplayModes = DisplayModeProvider.GetAvailableDisplayModesForContext(controllerContext.HttpContext, controllerContext.DisplayMode);
如果当前网页是PC端possibleDisplayModes会会被一个空的默认的DefaultDisplayMode填充,然后通过构建当前程序集标识把得到的虚拟路径存入Contexx.Cache。如果当前是移动端,通过Context.Cache搜寻到上次缓存的预留项,返回给当前视图引擎ViewEngine,最后呈现出各种设备所不同的结果。
.Net MVC的移动端原理就这么多了。看似似乎有点麻烦,由于微软高度的抽象,所有实现起来非常容易。
假如说,你当前有个控制器HomeController,里面有个Index方法。
public class HomeController : Controller
{
[HttpPost]
public ActionResult Index(Models.DemoModel DL)
{
return View();
}
[HttpGet]
public ActionResult Index()
{
return View();
}
视图的虚拟路径应该为 View/Home/Index.cshtml。
我们要做的就是在 View文件夹下面添加一个Index.Mobile.csthml页面。
所有工作至此结束了,如果你是PC端,你访问Home/Index的时候,他会自动识别和展示Index.cshtml视图,如果你访问的是移动端,他也会自动调整页面模式现实为Index.Mobile.cshtml。
注意:Mobile是关键字,不能随意更改。
如果你想要做出漂亮的手机端页面,你可以引入 JQuery Mobile类库,在Cshtml里面开发出各种绚丽的效果
方法2原文链接:https://blog.csdn.net/tangyanzhi1111/article/details/81588397
https://www.infoq.cn/article/Hybrid-Mobile-Apps-MVC/ 一个案例
asp.net 页面,文字自适应手机屏幕的更多相关文章
- 移动页面HTML5自适应手机屏幕宽度
标签: 网上关于这方面的文章有很多,重复的东西本文不再赘述,仅提供思路,并解释一些其他文章讲述模糊的地方. 1.使用meta标签,这也是普遍使用的方法,理论上讲使用这个标签是可以适应所有尺寸的屏幕的, ...
- HTML5 移动页面自适应手机屏幕四类方法
1.使用meta标签:viewport H5移动端页面自适应普遍使用的方法,理论上讲使用这个标签是可以适应所有尺寸的屏幕的,但是各设备对该标签的解释方式及支持程度不同造成了不能兼容所有浏览器或系统. ...
- 》》HTML5 移动页面自适应手机屏幕四类方法
1.使用meta标签:viewport H5移动端页面自适应普遍使用的方法,理论上讲使用这个标签是可以适应所有尺寸的屏幕的,但是各设备对该标签的解释方式及支持程度不同造成了不能兼容所有浏览器或系统. ...
- 移动端H5页面自适应手机屏幕宽度
1.由于本人使用的是sublime.text,使用rem就可以达到效果. 点击菜单中的preferences下的browse packages,选择cssrem-master,添加或者编写cssrem ...
- web页面自适应手机屏幕宽度
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scal ...
- flexible.js在华某为手机上使用rem时,页面宽度超出手机屏幕宽度
问题:手机端项目在华为的某款手机上显示时页面内容没有自适应手机宽度,出现横向滚动条 原因:手机获取手机屏幕宽度并计算出rem时出现偏差,明显宽余真实手机屏宽度 解决方案一:在页面里获取页面最外层dom ...
- WAP网站WML或HTML页面自适应手机屏幕实现方法
把图片和div的宽度都设置成:width:100%就可以了
- 使PC端网页宽度自适应手机屏幕大小
有时候我们会纠结PC页面在手机页面上无法正常显示,超出屏幕,有些内容看不到,现在又了下面的代码,可以做到自适应手机端的屏幕宽度: 在html的<head>中增加一个meta标签: < ...
- 移动端页面按手机屏幕分辨率自动缩放的js
<script> var phoneWidth = parseInt(window.screen.width); var phoneHeight = parseInt(window.scr ...
随机推荐
- 让我们创建屏幕- Android UI布局和控件
下载LifeCycleTest.zip - 278.9 KB 下载ViewAndLayoutLessons_-_Base.zip - 1.2 MB 下载ViewAndLayoutLessons_-_C ...
- 多测师讲解a'pi自动化框架设计思想_高级讲师肖sir
API自动化框架API自动化框架分为conf.data.utils.api.testcase.runner.report.log8个模块.conf是用来储存系统环境.数据库.邮件等的配置参数.项目的绝 ...
- 本溪6397.7539(薇)xiaojie:本溪哪里有xiaomei
本溪哪里有小姐服务大保健[微信:6397.7539倩儿小妹[本溪叫小姐服务√o服务微信:6397.7539倩儿小妹[本溪叫小姐服务][十微信:6397.7539倩儿小妹][本溪叫小姐包夜服务][十微信 ...
- Exists 和Not Exists使用
描述:exists表示()内子查询语句返回结果不为空说明where条件成立就会执行主sql语句,如果为空就表示where条件不成立,sql语句就不会执行.not exists和exists相反,子查询 ...
- Python3.7有什么新变化
https://docs.python.org/zh-cn/3/whatsnew/3.7.html
- UEditor 自定义图片视频尺寸校验
UEditor支持单图.多图以及视频上传,编辑器配置项支持文件格式.文件大小校验,对于文件宽高尺寸校验暂不支持.这里记录一下自定义图片.视频尺寸校验过程,内容核心主要是扩展校验逻辑和增加自定义提示文本 ...
- 分布式协调服务之Zookeeper集群部署
一.分布式系统概念 在聊Zookeeper之前,我们先来聊聊什么是分布式系统:所谓分布式系统就是一个系统的软件或硬件组件分布在网络中的不同计算机之上,彼此间通过消息传递进行通信和协作的系统:简单讲就是 ...
- 【Azure媒体服务 Azure Media Service】Azure Media Service中Stream Endpoint 说明 (流式处理终结点)
Azure 媒体服务是一个基于云的媒体工作流平台,用于生成需要编码.打包.内容保护和直播活动广播的解决方案. 在视频的直播,点播方案中,媒体服务的架构主要由三部分构成: 推流端,把本地视频或直播内容推 ...
- Ⅲ Dynamic Programming
Dictum: A man who is willing to be a slave, who does not know the power of freedom. -- Beck 动态规划(Dy ...
- Dockerfile 笔记
Dockerfile ARGARG <name>[=<default value>]The ARG instruction defines a variable that ...