技术:
1、设置视口标签
2、使用媒体查询
3、响应字体
4、响应图片
5、采用百分比
媒体查询
媒体查询:@media mediaType and (media feather){
选择器{
属性名:属性值
}
}
mediaType :设备类型
media feather:乘体特性表达式
mediaType 设备类型:
aLL 所以的多媒体设备
print 打印机或者打印预觉
screen 电脑屏幕、平板电脑、智能手机
speech 屏幕阅读器等发生设备
media feather: 媒体特性表达
width: 浏览器的宽度
height; 浏览器的高度
max-width:最大宽度
min-width:最小笼度
max-height;最大高度
min-height:最小高度
device-width:设备的宽度
device-height;设备的高度
max-device-width: 设备的最大宽度
min-device-width: 没备的最小宽度
orientation: 设置厨口的朝回
1、横屏orientation: landscape;
2、坚屏 orientation; portrait;
3.操作符:
and----与
not----非 not是用来排除某种特定的设备
noly----用来指定某种特性的设备