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 ...
随机推荐
- ## 20155336 2016-2017-2《JAVA程序设计》第八周学习总结
20155336 2016-2017-2<JAVA程序设计>第八周学习总结 教材学习内容总结 第14章 NIO与NIO2 NIO简介 NIO使用频道来衔接数据结点,在处理数据时,NIO可以 ...
- HDU1102&&POJ2421 Constructing Roads 2017-04-12 19:09 44人阅读 评论(0) 收藏
Constructing Roads Time Limit : 2000/1000ms (Java/Other) Memory Limit : 65536/32768K (Java/Other) ...
- 自定义View--滚动View
实现这么一个效果,一个布局中有一个View,那个View会随着我们手指的拖动而滑动,这种效果该如何实现? 我们第一反应应该是自定义一个DragView类继承View,然后重写onTouchEven ...
- MFC中的乱起八糟----字符编码:LPTSTR,LPCTSTR, TCHAR等
注意,编写有 Unicode 意识的代码总是一件好事,比如: CString graycat = CString(_T("Gray")) + _T("Cat") ...
- delphi Overload 和override的区别
overload是重载;相同的函数名,参数不同,使用不同的函数体 override 是对父类声明的vitural或dynamic方法进行覆盖 overload的使用方法: [delphi] v ...
- 咏南中间件新增SQL日志
为了方便开发时跟踪调试SQL语句的执行情况,咏南中间件新增SQL日志,所有执行过的SQL都会写入SQL日志文件中. SQLDEBUG设为1,启用:设为0,停止写SQL日志.
- ASP.NET Core2调用Azure云上的PowerBI报表展示
在开发企业应用中,报表功能是当之无愧的重头戏,如何将数据通过合适的报表呈现出来成为每个项目人员必需面临的问题.而找到一款合适的报表往往都需要考率价格.开发.风格.支撑等因素.那么,我在这里给大家介绍一 ...
- Flink本地环境安装部署
本次主要介绍flink1.5.1版本的本地环境安装部署,该版本要求jdk版本1.8以上. 下载flink安装包:http://archive.apache.org/dist/flink/flink-1 ...
- 教你如何学python
首先,你要有自信心,要明确学习目的.学Python,可以解决在软件使用中所遇到的问题,可以为找到理想工作添加重要砝码.还能锻炼思维,使我们的逻辑思维更加严密:能不断享受到创新的乐趣,将走在高科技的前沿 ...
- Postgresql 分区表 一
Postgres 10 新特性 分区表 http://francs3.blog.163.com/blog/static/40576727201742103158135/ Postgres 10 之前分 ...