css3怎么实现屏幕自适应

html-css07

css3怎么实现屏幕自适应,第1张

试用css3 语法@media screen and (判断属性){ CSS样式选择器 }

1、DIV+CSS小案例描述

根据整体来设置,设置他们的最大宽度(width)为640px,最小宽度为320px,此类设置适用于手机移动端;要实现屏幕自适应,那么就要用百分比来实现;所以设置width整体100%;img宽度100%;这样实现图片的自由缩放;

HTML代码如下:且仔细看清每一行的注释:

2、看下实现的效果如何:文字大小是如何变化的;

变化浏览器后效果:如图

自定义缩放其实主要就是判断浏览器的宽度,高度需要的话可以设置,还有设置内部区域块儿的宽度以及图片展示用百分比来控制;

jquery是一个js库

jquery mobile是jquery针对移动端的库

html5是html4的升级版, 跟以前html没什么区别, 只是多了一些新标签和一些高级功能

css3同样是css的升级版, 多了很多好用的属性