media(适配)
媒体类型
1.all 所有媒体
2.braille 盲文触觉设备
3.embossed 盲文打印机
4.print 手持设备
5.projection 打印预览
6.screen 彩屏设备
7.speech '听觉'类似的媒体类型
8.tty 不适用像素的设备
9.tv 电视
媒体特性
1.(max-width:599px)
2.(min-width:600px)
3.(orientation:portrait) 竖屏
4.(orientation:landscape) 横屏
5.(-webkit-min-device-pixel-ratio: 2) 像素比
关键字
1.and
2.not not关键字是用来排除某种制定的媒体类型
3.only only用来定某种特定的媒体类型
-很多时候是用来对那些不支持媒体特性但却支持媒体类型的设备
01.@media all and (min-width: 600px) 02.{ 03. .box 04. { 05. width:100px; 06. } 07.}
media(适配)的更多相关文章
- media适配css
/*引入适配的less*/ html { font-size: 16px; } @media only screen and (min-width: 320px) { html { font-size ...
- @media 适配兼容
/* 兼容iphone4/4s */ @media (device-height:480px) and (-webkit-min-device-pixel-ratio:2){ } /* 兼容iphon ...
- 移动web之一像素问题
一.为什么会有一像素问题 弄明白这个问题,首先要知道DPR了. DPR(device pixel ratio)pixel等于picture element.设备像素比,是默认缩放100%的情况下,即D ...
- 在移动端实现1px的边框
由于分辨率 DPI 的差异,高清手机屏上的 1px 实际上是由 2×2 个像素点来渲染,有的屏幕甚至用到了 3×3 个像素点 所以 border: 1px 在移动端会渲染为 2px 的边框 与设计图产 ...
- 怎样通过css的media属性,适配不同分辨率的终端设备?
怎样通过css的media属性,适配不同分辨率的终端设备,示比例如以下: <!DOCTYPE html> <html> <head> <title>首页 ...
- @media响应式的屏幕适配
当页面小于960px的时候执行 @media screen and (max-width: 960px){ body{ background: #000; } } 等于960px尺寸的代码 @medi ...
- html5移动端适配- media query
iPad部分css适配 - media query 代码如下图: 注: @media要放在css最下方,防止被覆盖.
- Css3 Media Queries移动页面的样式和图片的适配问题(转)
CSS3 Media Queries 摘自:http://www.w3cplus.com/content/css3-media-queries Media Queries直译过来就是“媒体查询”,在我 ...
- 媒体查询@media 屏幕适配
@media(max-width: 1199px){.banner{height: 400px;}}1.6倍@media(min-width: 1200px) and (max-width: 1365 ...
- 手机端@media的屏幕适配
@media only screen and (width: 320px) { html { font-size: 16px; }} @media only screen and (width: 36 ...
随机推荐
- URAL1991 The battle near the swamp 2017-04-12 18:07 92人阅读 评论(0) 收藏
The battle near the swamp Gungan: Jar Jar, usen da booma! Jar Jar: What? Mesa no have a booma! Gun ...
- 寻找最大的K个数(上)
这是一道很经典的题目,有太多方法了,今天写了两种方法,分别是快排和堆排序 #include <iostream> using namespace std; #define N 25 //初 ...
- Websocket出现的错误
前端使用sockjs,后台使用spring的websocket框架 结果在一个网络较慢的地方,发现tomcat报错信息: Oct 28, 2015 10:10:43 AM org.apache.cat ...
- cxgrid的FINDPANEL编程
cxgrid的FINDPANEL编程 FindPanel := TcxGridFindPanel.Create(cxGrid1DBTableView1.Controller); self.cxGrid ...
- 学习python的第五天
4.30自我总结 一复习 1.查看数据类型 #数值10的位置 print(di(10)) #数值10的样式 print(type(10)) 2.关于变量的一些补充 a=1 b=1 c=1 #a,b,c ...
- struts中request传递中文乱码问题
系统本来是好好地,这两天升级后,各种问题不断,总而言之,一句话,心惊胆战. 今天,搜索任何中文,都是有乱码,在action中转码就ok了.公司系统那么多action,都转码,要累死吧.配置的过滤器都不 ...
- python将json转csv
现有一个需求要将json转成excel,使用python将其转为csv格式,使用excel打开即可. import json import csv import codecs f = open('te ...
- centos升级gcc
https://blog.csdn.net/lanwilliam/article/details/77893033 [root@DS-VM-Node239 ~]# yum install centos ...
- C# task和timer实现定时操作
C#中,定时器,或者叫作间隔器,每隔一段时间执行一个操作. 1.Timer本身就是多线程 C#中为不同场合下使用定时器,提供了不同的Timer类,在asp.net中一般使用System.Timers. ...
- null、 is_null() 、empty() 、isset() PHP 判断变量是否为空
PHP中,在判断变量是否为空的时候,总会纠结应该选用哪个函数,下面列取常用的多种情况,其中1/3经过我的验证,其它来自网络,验证后使用... 使用 PHP 函数对变量 $x 进行比较 表达式 gett ...