*{
margin:0;padding:0;outline:0
}
a{
text-decoration:none
}
body,html{
font-size:20px;font-family:'Microsoft YaHei,微软雅黑';height:100%;
}
-webkit-input-placeholder{
color:#ccc
}
::-moz-placeholder{
color:#ccc
}
:-ms-input-placeholder{
color:#ccc
}
input:-moz-placeholder{
color:#ccc
}
html{
font-size:20px;height:100%
}
@media only screen and (min-width:320px) and (min-height:480px){
html{
font-size:20px!important
}
}
@media only screen and (min-width:320px) and (min-height:568px){
html{
font-size:20px!important
}
}
@media only screen and (min-width:360px) and (min-height:640px){
html{
font-size:22.5px!important
}
}
@media only screen and (min-width:375px) and (min-height:667px){
html{
font-size:23.5px!important
}
}
@media only screen and (min-width:414px) and (min-height:736px){
html{
font-size:25.9px!important
}
}
@media only screen and (min-width:736px){
html{
font-size:46px!important
}
}

html5+css3 手机屏幕的适配css的更多相关文章

  1. 移动页面HTML5自适应手机屏幕宽度

    标签: 网上关于这方面的文章有很多,重复的东西本文不再赘述,仅提供思路,并解释一些其他文章讲述模糊的地方. 1.使用meta标签,这也是普遍使用的方法,理论上讲使用这个标签是可以适应所有尺寸的屏幕的, ...

  2. Unity3d 手机屏幕自动适配

    我提到手机自动适配的一个方法中:postion和Scale,“比例”概念适配手机.原始资源是480*800 经过实际项目考验,个人感觉: 1,UICamera是自动适配分辨率,UI上也是拉伸.放大UI ...

  3. CSS3自适配手机屏幕[转]

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  4. CSS3自适配手机屏幕

    @media only screen and (max-width:350px){ .img{ width: 80px; height:70px; background-image: url(./im ...

  5. HTML5+CSS3的响应式网页设计:自动适应屏幕宽度

    这几天都在修改博客上面的样式.本来用的是d83.0的模板.自己又修改了许多地方,其中自己修改的一些地方在手机里面显示的效果不是很理想,于是想改成自适应的效果.对CSS3不是特别的熟练,只能去网上找找案 ...

  6. 第九十三节,html5+css3移动手机端流体布局,基础CSS,头部设计,轮播设计,底部设计

    html5+css3移动手机端流体布局,基础CSS,头部设计,轮播设计,底部设计 基础CSS 首先将通用css属性写好 @charset "utf-8"; /*通用样式*/ /*去 ...

  7. 根据判断PC浏览器类型和手机屏幕像素自动调用不同CSS的代码

    1.媒体查询方法在 css 里面这样写 -------------------- @media screen and (min-width: 320px) and (max-width: 480px) ...

  8. 了解真实的『REM』手机屏幕适配

    rem 作为一个低调的长度单位,由于手机端网页的兴起,在屏幕适配中得到重用.使用 rem 前端开发者可以很方便的在各种屏幕尺寸下,通过等比缩放的方式达到设计图要求的效果. rem 的官方定义『The ...

  9. web app变革之rem(手机屏幕实现全适配)

    以往web移动适配,常规写法是:media only screen @media only screen and (min-device-width: 320px){ //针对iPhone 3 } @ ...

随机推荐

  1. 穷竭搜索: POJ 2718 Smallest Difference

    题目:http://poj.org/problem?id=2718 题意: 就是输入N组数据,一组数据为,类似 [1  4  5  6  8  9]这样在0~9之间升序输入的数据,然后从这些数据中切一 ...

  2. srpingboot2 session过期时间设置

    springboot2 设置session过期的配置 server.servlet.session.timeout = 1800 而不再是 server.session.timeout=1800

  3. Android SDK更新失败对策

    Fetching https://dl-ssl.google.com/android/repository/addons_list-2.xml Failed to fetch URL https:// ...

  4. dubbo Filter

    官方说明: 调用拦截扩展 扩展说明 服务提供方和服务消费方调用过程拦截,Dubbo 本身的大多功能均基于此扩展点实现,每次远程方法执行,该拦截都会被执行,请注意对性能的影响. 约定: 用户自定义 fi ...

  5. laravel更新某一个或几个字段

    //更新会员状态status $ary_where = array(); $ary_where[] = ['id', '=', $int_id]; $result = $this->obj_ad ...

  6. POJ 2438 Children’s Dining (哈密顿图模板题之巧妙建反图 )

    题目链接 Description Usually children in kindergarten like to quarrel with each other. This situation an ...

  7. pf

    here Pro 排列n个不同的数成为长度为p的序列 每两个相同的数之间至少要隔着m个数 求排列总方案数 Input 三个整数 n,m,p output 输出一个数字表示序列组成方法,由于结果可能很大 ...

  8. Django-数据库增查

    1/ python manage.py shell ---------一般用于调试操作 2/ 建表--定义类 #产品表 class ProductModel(models.Model): #通过类属性 ...

  9. linux tar 解压出错

    今天用tar -xzvf php-7.2.3.tar.gz 解压php的tar包时报错 [root@VM_72_37_centos ~]# tar -xzvf php-.tar.gz gzip: st ...

  10. bootstrap_bootstrap中日历范围选择插件daterangepicker的使用

    1.引入脚本 <link rel="stylesheet" type="text/css" href="assets/css/bootstrap ...