相关文章
HTML5在vivo手机适配问题
1、es6符号 不适配,可改成 ’ 2、window.fun () > {} 改为 window.fun function(){} 3、window.open() 改为window.location.href “” 4、str.startsWith("") 或者 str.endsWith("") 改为 str.indexOf("") > 1 5、let 改为…
建站知识
2024/11/25 22:31:12
html页面适配手机端方法
在head中加:
<meta name"viewport" content"widthdevice-width, initial-scale1.0, maximum-scale1.0, minimum-scale1.0, user-scalableno">
注释:
viewport :用户网页的可视区域. width:控制viewp…
建站知识
2024/11/26 8:38:32
前端html原生页面兼容多端H5和移动端适配方案
目录 图片代码参考最后 px 与 rem 互转在线工具 图片 是一个注册页面 代码 自己查看效果 注意: 单位全部用rem这样才能保证兼容性适配多端,px转rem转换公式 1px 1/37.5rem 所以想要20px应该对应20/37.5 0.53rem
<!DOCTYPE html>
<html lang"en&q…
建站知识
2024/11/24 0:44:09
HTML5 移动端页面适配 iOS 系统刘海屏
1. Apple官方适配方案
在 iphone X 之后引入了一个新概念:“safe area(安全区域)”,安全区域指屏幕内不受圆角、齐刘海、底部小黑条等元素影响的可视窗口。如下图: 从 iOS11 开始 ,为了适配刘海屏…
建站知识
2024/11/24 22:40:01
html手机端自适应头部,html5写自适应头部
仿写的一个聚划算的例子 *{ margin: 0; padding: 0; } header{ width: 100%; height: 45px; background-color: rgba(242,24,97,.95); display: -webkit-box; } header .logo{ width: 110px; height: 45px; background-color: orange; position: relative; } header .logo h1{ …
建站知识
2024/11/24 2:34:12
h5分享页适配手机电脑
实现思路
通过media媒体查询结合rem继承html文字大小来实现。
快捷插件配置
这里使用了VSCode的px to rem插件。
先在插件市场搜索cssrem下载插件; 配置插件
页面编写流程及适配详情
配置meta h5常用配置信息:<meta name"viewport" content&quo…
建站知识
2024/11/15 1:35:05
h5 手机屏幕适配—REM
一、rem、em和px之间的关系 使用rem之前,先得弄清楚rem、em和px之间的关系,特别是每一个单位的使用跟代码块的继承之间的关系: 单位代码地址运行后截图说明pxhttps://coding.net/u/Jill/p/dankal-jill/git/blob/master/rem/px.html字体恒定没有变化emhttps://coding.net/u/J…
建站知识
2024/11/15 1:56:48