移动端css适配
/* iphoneX、iphoneXs */
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3){
.bottom{bottom: 34px;}
.lastp{padding-bottom: 3.2rem;}
}
/* iphone Xs Max */
@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio:3) {
.bottom{bottom: 34px;}
.lastp{padding-bottom: 3.2rem;}
} /* iphone XR */
@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio:2){
.bottom{bottom: 34px;}
.lastp{padding-bottom: 3.2rem;}
}
移动端css适配的更多相关文章
- 了解css中px、em、rem的区别并使用Flexible实现vue移动端的适配
本人java菜鸟一名,若有错误,还请见谅. 1.px和em和rem的定义和区别 px:px像素,是相对单位,相对于屏幕的分辨率而言,也就是说,当屏幕的分辨率不同那么px相同,实际看到的大小也会不同. ...
- 国内外移动端web适配屏幕方案
基础知识点 设备像素:设备像素又称物理像素(physical pixel),设备能控制显示的最小单位,我们可以把这些像素看作成显示器上一个个的点. iPhone5的物理像素是640X1136. PS: ...
- 移动端font-size适配方案
概述 这是我研究移动端页面时的思考,记录下来供以后开发时参考,相信对其他人也有用.由于我写移动端页面写的还比较少,一些问题都还没遇到,所以我的这篇博文不免有些错误的地方,还请大佬多多指正. 这篇文章是 ...
- 移动端H5适配方法(盒子+图片+文字)
一.怎么让H5页面适应手机 a.利用meta标签 <meta name="viewport" content="width=device-width,initial ...
- 07. 如何实现移动端rem适配
如何实现移动端rem适配 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...
- 移动端rem适配&iOS兼容
移动端rem适配js // 默认375,750设计稿请将375替换为750 (function (doc, win) { // 移动端适配 var docEl = doc.documentElemen ...
- 移动端 css/html (box-flex)自适应、等比布局
移动端 css/html (box-flex)自适应.等比布局 对于移动端自适应的一种布局方式. <!DOCTYPE html> <html> <head> < ...
- 移动端 css实现自适应正圆 ( 宽高随着手机屏幕宽度自适应 )
序言:应朋友要求随手写了一下移动端 css实现自适应正圆 ( 宽高随着手机屏幕宽度自适应 ) ,以备后用 LESS代码: .adaptive-circle { margin: 50px auto 0; ...
- web前端开发常用的10个高端CSS UI开源框架
web前端开发常用的10个高端CSS UI开源框架 随着人们对体验的极致追求,web页面设计也面临着新的挑战,不仅需要更人性化的设计理念,还需要设计出更酷炫的页面.作为web前端开发人员,运用开源 ...
随机推荐
- 接口测试 dubbo 接口测试
dubbo是阿里巴巴开源的一套rpc方案,以为理念很契合微服务,这几年很火,用户里面不凡京东,当当,去哪儿等大公司.rpc场景 dubbo架构 官网也提供了一个很简单实用的demo来演示dub ...
- 【Linux】部署NTP时间同步服务器
1. 查看机器的Linux版本 查看集群内所有服务器的linux版本,确保相同,不要跨大版本. [root@bigdata111 ~]# cat /etc/redhat-release CentOS ...
- cmake 在mac系统的安装
CMake是一个比make更高级的跨平台的安装.编译.配置工具,可以用简单的语句来描述所有平台的安装(编译过程).并根据不同平台.不同的编译器,生成相应的Makefile或者project文件.本文主 ...
- python-文件常用操作
文件内建函数和方法: open()——打开文件 read()——输入 readline()——输入一行 seek()——文件内移动 write()——输出 close()——关闭文件 练习:
- Tomcat: has been normalized to [null] which is not valid
环境 tomcat 8.5 原因 在使用相对路径加载配置文件时,如果相对路径超出了 tomcat 容器的根目录,那么 tomcat 会提示 xxx has been normalized to [nu ...
- T100——单据别的新增、修改设置
何为单据别,例如下图,新增的时候开窗选择单据别: 新增单据别: 1.首先在azzi600 系统分类码维护作业里面新增新的系统分类码(在系统分类码24下新增),如图: 2.在azzi910 作业基本数据 ...
- 搞懂ZooKeeper到底是做啥的
一.ZooKeeper是啥 ZooKeeper概念 ZooKeeper是一个开源的分布式协调服务(a service for coordinating processes of distributed ...
- Java多线程(二):Thread类
Thread类的实例方法 start() start方法内部会调用方法start方法启动一个线程,该线程返回start方法,同时Java虚拟机调用native start0启动另一个线程调用run方法 ...
- 与 QWidget 有关的 Qt 可视化组件的继承关系图
与 QWidget 有关的 Qt 可视化组件的继承关系图
- 4.图片左轮播图(swiper)
一.html部分 二.js部分 三.源代码部分 <body> <div id="box"> <img src="imges/111.jpg& ...