h5页面有个很蛋疼的问题就是,当输入框在最底部,点击软键盘后输入框会被遮挡。可采用如下方式解决var oHeight = $(document).height(); //浏览器当前的高度 KaTeX parse error: Expected '}', got 'EOF' at end of input: …function(){ if((document).height() < oHeig
移动的 1px问题描述:1px 的边框。在高清屏下,移动的 1px 会很粗。产生原因:首先先要了解一个概念:DPR(devicePixelRatio) 设备像素比,它是默认缩放为 100%的情况下,设备像素和 CSS 逻辑像素的比值。目前主流的屏幕 DPR=2 或者 3。CSS中设置的px是逻辑像素,这就造成1px变成物理像素的2px或者3px,比如2 倍屏,设备的物理像素要实现 1 像素,所
原创 2021-11-20 19:19:27
668阅读
ngth>, <frequency>, <angle>, <time>, <number
转载 2017-02-22 19:35:00
544阅读
2评论
实例使用 calc() 函数计算 <div> 元素的宽度:#div1 { position: absolute; left: 50px; width: calc(100% - 100px); border: 1px
原创 2022-03-23 10:10:25
371阅读
一些移动浏览器的兼容性Bug 做移动的Web也有一段时间了,踩过的坑真心不少。下面列出一些,移动浏览器兼容性的Bug,供大家参考。 【UC浏览器】video标签脱离文档流场景:<video>标签的父元素(祖辈元素)设置transform样式后,<video>标签会脱离文档流。测试环境:UC浏览器 8.7/8.6 + Android 2.3/4.0
calc() 函数用于动态计算长度值。 需要注意的是,运算符前后都需要保留一个空格,例如:width: calc(100% - 10px); 任何长度值都可以使用calc()函数进行计算; calc()函数支持 "+", "-", "*", "/" 运算; calc()函数使用标准的数学运算优先级规 ...
转载 2021-09-17 20:23:00
300阅读
2评论
实例使用 calc() 函数计算 <div> 元素的宽度:#div1 { position: absolute; left: 50px; width: calc(100% - 100px);
原创 2021-04-13 23:24:46
586阅读
负责一个项目pc的,再上线以后呢,想兼容移动。用同一套页面 1.方法1 定义视口窗口,简单,可以在手机上看到一个缩小版的pc
原创 2022-07-06 11:50:40
847阅读
移动适配相对于PC端来说,移动设备分辨率百花齐放,千奇百怪,对于每一个开发者来说,移动适配是我们进行移动开发第一个需要面对的问题。在移动我们经常可以在head标签中看到这段代码:<meta name='viewport' content='width=device-width,initial-scale=1,user-scale=no' />通过meta标签对viewport
转载 2024-06-17 11:55:03
255阅读
1.二倍图1.1 物理像素&物理像素比物理像素指的是屏幕的最小颗粒,是物理真实存在的。这是厂商在出厂时就设置好了,比如苹果6\7\8是750*1334我们开发时候的1px不是一定等于1个物理像素的PC页面,1个px等于1个物理像素的,但是移动就不尽相同一个px的能显示的物理像素点的个数,称为物理像素比或屏幕像素比1.2 背景缩放background-size语法:background-
转载 2023-07-13 11:23:17
269阅读
web移动布局范畴很广,其中比较基础的几个话题:移动适配1px border基础布局本文主要分享这三个话题一、移动适配提起移动适配,大家想到的肯定是rem、flexible.js,本文要分享的方案是 vw + rem对移动适配不熟悉的同学,可以看看:使用Flexible实现手淘H5页面的终端适配再聊移动页面的适配如何在Vue项目中使用vw实现移动适配vw 是什么?vw 是基于视图(V
我们在vue移动项目中的适配一般都采用rem,但是rem也不是能兼容所有的终端。随着viewport单位越来越受到众多浏览器的支持,下面将简单介绍怎么实现vw的兼容问题,用vw代替rem当我们采用vue-cli脚手架搭建完项目,安装所有依赖包之后,用npm run dev启动后,在根目录有一个 .postcssrc.js 文件,文件结构如下:vue-cli默认已经安装以上三个插件:postcss
移动导读移动适配,是我们在开发中经常会遇到的,这里面可能会遇到非常多的问题:1px 问题UI 图完美适配方案iPhoneX 适配方案高清屏图片模糊问题…接下来我们从移动适配的基础概念出发,探究移动适配各种问题的解决方案和实现原理一、英寸一般用英寸描述屏幕的物理大小,如电脑的 13、16,手机显示器的 4.8、5.7 等使用的单位都是英寸。需要注意,上面的尺寸都是屏幕对角线的长度: 英寸(i
转载 10月前
236阅读
最近两个做了一个展示试卷信息,选项等,并在前端页面打分 把分数与选项传进数据库,并且可以点击回显。 页面功能:我的试卷是代表着用户已做完的试卷,点击会弹出组件展示已做完试卷的信息(测试数据就放了一个,他里面还集成了下拉加载) 在首页点击继续考试或者开始考试弹出做题组件 接下来上代码(后台返回的测试数据) 首页html代码<tem
问题的路太痛苦了首先需要解决低版本系统的移动无法渲染页面,因为低版本浏览器只支持ES5语法
项目使用VUE编写,UI是ElementUI,但是Element的Upload组件是不兼容IE9的。因为IE9中无法使用FormData。查找资料基本有两种解决方法:1.引入JQuery和jQuery.form。2.使用vue-upload-component1、jQuery.form  插件提供ajaxSubmit和ajaxForm两种表单提交方式,注意:不要对同一个表单同时使用两种方式。  a
转载 2024-10-17 12:06:20
59阅读
CSS 中的 calc今天做页面处理一个input的时候怎么也弄不好了。 最后查到了calc这个
原创 2022-06-30 11:11:18
119阅读
css3在不同型号手机浏览器上的兼容: 对于webkit内核的浏览器, 除media、text-shadow外,使用其它属性基本上要加上webkit前缀. gradient在低版本的系统中渲染效果不丰富 ios3.2~4.3不支持position:fixed,不推荐使用 android2.1~2.3
转载 2016-03-14 17:09:00
509阅读
2评论
# 解决“iframe 移动兼容 iOS”问题的流程 在移动开发中,iOS 设备对 `iframe` 的支持可能会遇到一些问题,特别是在 Safari 浏览器上。如果你是刚入行的小白,不用担心,这篇文章将为你详细介绍如何处理这一问题。 ## 流程概述 我们可以将解决这个问题的过程分为以下几个步骤: | 步骤 | 描述 | |------
原创 2024-10-20 04:49:14
721阅读
上一章讲了正则表达式,这一章继续我们的前菜,浏览器兼容性处理。先介绍一个简单的沙盒测试函数。/** * Support testing using an element * @param {Function} fn Passed the created div and expects a boolean result */ //特性检测的一个技巧,造一个div,最后将其删掉,提供一种简单的沙
  • 1
  • 2
  • 3
  • 4
  • 5