微信页面打开显示的样式与手机浏览器打开显示的样式不一样

最新推荐文章于 2024-07-21 07:00:05 发布
最新推荐文章于 2024-07-21 07:00:05 发布
阅读量1.5w 收藏
点赞数
分类专栏： 笔记 CSS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/itx2000/article/details/39319259
版权
笔记 同时被 2 个专栏收录
130 篇文章 0 订阅
订阅专栏
CSS
12 篇文章 0 订阅
订阅专栏
  1.    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
  2. 在<head>中加入这一句
  3. 网页手机wap2.0网页的head里加入下面这条元标签，在iPhone的浏览器中页面将以原始大小显示，并不允许缩放。  
  4. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">   
  5.   
  6. width - viewport的宽度 height - viewport的高度   
  7. initial-scale - 初始的缩放比例  
  8. minimum-scale - 允许用户缩放到的最小比例   
  9. maximum-scale - 允许用户缩放到的最大比例  
  10. user-scalable - 用户是否可以手动缩放 
yghuaa
关注
专栏目录
IOS和安卓微信打开网页，界面显示差异大的问题。
weixin_40648113的博客
06-23 2932
IOS和安卓微信打开网页，界面显示差异大的问题。&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml" &...
meta name="viewport" content="width=device-width,initial-scale=1.0" 解释
weixin_30485379的博客
03-25 162
<meta name="viewport" content="width=device-width,initial-scale=1.0"> content属性值 : width:可视区域的宽度，值可为数字或关键词device-width height:同width intial-scale:页面首次被显示是可视区域的缩放级别，取值1.0...
微信环境中如何设置微信跳转浏览器打开链接
dinghuo6864的博客
01-05 4045
微信上进行的网页宣传、游戏传播、APP下载各类活动很多，但是各位朋友肯定经常会遇到一些特殊需求，网页需要在手机默认浏览器打开而不是微信内置浏览器。这个问题怎么解决呢? 解决方案：微信中打开链接，自动打开外部浏览器打开页面 微信中点击或打开链接，自动打开外部浏览器打开指定页面。全程完全自动化，无需用户任何手工操作。 这种方案可以说是完美解决这个的问题。效果如下面这样子： ...
浏览器访问微信网页
最新发布
weixin_40367377的博客
07-21 158
第一步：微信浏览器打开网页（同时打开抓包工具） 这时候已经登陆成功了 所以抓包工具的请求里面 就有cookie 和 ua 第二步：复制到浏览器里面 ua 和 cookie 先断网 设置ua 和 cookie 然后开网络访问就可以了
H5———IOS安卓微信中显示样式不同、IOS点击无反应
weixin_45629623的博客
04-26 1529
样式问题 两个系统在微信浏览器中显示不同，主要原因是两者默认样式标准不同，当你没有指定样式的时候，他就会以默认样式呈现。所以一般你在PC浏览器看到的会和手机上看到的不一样。 例子：比如color你没指定、font-size没指定，button标签的边框有时候指定了还是会变的，所以用div会比较好。 IOS点击无反应 IOS那边是需要指定css那个小手样式才能点击的。（但不是全部都无法点击，只是无法点击的部分设置这个就可以正常点击了，我也不懂，希望评论区大佬指教，我当时是div绑定的点击事件） 修改鼠标性状
自适应布局meta标签中viewport、content、width、initial-scale、minimum-scale、maximum-scale总结
08-29
主要介绍了移动客户端手机页面布局时各标签元素作用和适用情景，通过详解几种属性让读者更明确自适应布局的注意点，具体操作步骤大家可查看下文的详细讲解，感兴趣的小伙伴们可以参考一下。
移动前端开发之viewport的深入理解
热门推荐
FFy's Blog
01-26 1万+
在移动设备上进行网页的重构或开发，首先得搞明白的就是移动设备上的viewport了，只有明白了viewport的概念以及弄清楚了跟viewport有关的meta标签的使用，才能更好地让我们的网页适配或响应各种不同分辨率的移动设备。 一、viewport的概念 通俗的讲，移动设备上的viewport就是设备的屏幕上能用来显示我们的网页的那一块区域，在具体一点，就是浏览器上(也可能是一个a
<meta name="viewport" content="width=device-width
tianyitianyi1的专栏
06-26 1907
网页手机wap2.0网页的head里加入下面这条元标签，在iPhone的浏览器中页面将以原始大小显示，并不允许缩放。       width - viewport的宽度 height - viewport的高度   initial-scale - 初始的缩放比例  minimum-scale - 允许用户缩放到的最小比例   maximum-scale - 允许用户缩放到的最大比例  user-s
html5开发之viewport使用
weixin_34378767的博客
08-30 1144
2019独角兽企业重金招聘Python工程师标准>>> ...
viewport的meta标签 <meta name="viewport" content="
aa88342249的博客
11-29 208
网页手机wap2.0网页的head里加入下面这条元标签，在iPhone的浏览器中页面将以原始大小显示，并不允许缩放。 <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> ...
js插件方式打开pdf文件(浏览器pdf插件分享)
10-26
注意，在使用JavaScript插件显示PDF文件时，开发人员需要确保插件与所使用的浏览器兼容，以提供最佳的用户体验。此外，随着Web技术的快速发展，应该定期检查各个插件的更新和维护情况，避免在项目中使用过时或不再...
安卓微信浏览器中--唤起键盘页面高度减小问题
Riona_cheng的博客
08-29 1382
解决键盘唤起使页面高度减小（安卓兼容问题）
关于H5页面在微信浏览器中视频播放的问题
weixin_30745553的博客
07-23 1万+
Android 上，因为各个软件使用的浏览器渲染引擎不一样，所以视频播放的效果差异也很大，这里主要以微信为主。微信使用的是腾讯浏览器自带的X5内核。 而iOS是不允许使用第三方浏览器内核的，就是Google Chrome也是用的系统内建的Webkit浏览器内核 (就是WebView了)，APP 都是使用的系统自带的浏览器进行页面渲染,所以IOS的微信浏览器是Chrome的webkit内核。 ...
vue在微信里面的兼容问题_微信H5页面兼容性问题分析及解决方法
weixin_31967551的博客
12-31 2297
随着H5页面越来越流行，越来越多的开发者都开始用最近H5做微信公众号，在这个过程中自然也会遇到不少的问题。小编在这里整理了五种常见的微信H5页面兼容性问题，来和大家分析一下问题的详情、出现原因以及相对应的解决方法。有相关问题的小伙伴，就一起来看看吧！1、ios端兼容input光标高度问题详情描述：input输入框光标，在安卓手机上显示没有问题，但是在苹果手机上当点击输入的时候，光标的高度和父盒子的...
<meta name="viewport" content="width=device-width, initial-scale=1.0">
wuyujin1997的博客
05-17 2935
Code <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, ...
<meta name="viewport" content="width=device-width, initial-scale=1.0">
zeroone001的专栏
08-26 3829
在编写Bootstrap前端的时候遇到了这行代码，
<meta name="viewport" content="width=device-width, initial-scale=1.0">的说明
weixin_34408624的博客
12-01 507
今天在做适配手机版时，chrome调到手机版，但是还是显示PC端的样式，无法展现出手机端的样式； 开始的时候还以为是chrome版本的问题，最新版本的chrome62.0是有很多变化的，而之前工作中使用最多的chrome来调试，是带有标尺等等。 搜索chrome版本无果，想了下，按照道理chrome版本越新，功能应该更好用才是。 百度了一下，发现是因为这句话：<meta name...
Meta
ljxqsq的专栏
03-25 493
一、网页手机wap2.0网页的head里加入下面这条元标签，在iPhone的浏览器中页面将以原始大小显示，并不允许缩放。 其中： width - viewport的宽度 height - viewport的高度 initial-scale - 初始的缩放比例 minimum-scale - 允许用户缩放到的最小比例 maximum-scale - 允许用户缩放到的最大比例 user-scal
<meta name="viewport" content="width=device-width, initial-scale=1.0>
zlpzlpzyd的专栏
11-06 854
上面的属性我在使用jQuery Mobile的时候发现的，
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值