码迷,mamicode.com
首页 > 其他好文 > 详细

响应式设计

时间:2015-11-30 20:20:28      阅读:134      评论:0      收藏:0      [点我收藏+]

标签:

 

不同设备设计顺序优先级

1、用户人群占主导,客户使用设备占有比大的人群优先。

2、客户使用设备占比平均的情况下,从大屏做到小屏, 做减法比做加法容易。

 

 

<meta name =”view port” content=”width:device-width,initial-scale=1”>

网页的宽度默认等于屏幕宽度。原始的缩放比例initial-scale=1

 

 

Media 的属性。

All:所有的媒体类型

Screen:电脑显示器

Handheld 便携式设备

Tv 电视类型设备

Print  打印预览视图。

 

媒介的使用方法

1、引用不同的样式表

<link rel=”stylesheet”   type=”text/css”   media=”(判断条件)”  href=”css样式表”/>

判断条件:(min-width:XXpx)  &  (max-width:XXpx)

 

2、执行不同的css样式

 

@media(判断条件){

符合条件的样式

}

 

Vw 屏幕的宽度。  Vh屏幕高度

响应式设计

标签:

原文地址:http://www.cnblogs.com/feiyu1111111111/p/5007996.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!