360浏览器,open windoww.open打开一个新页面

来源：蜘蛛抓取(WebSpider) 时间：2019-08-05 10:15 标签： open window

当今移动设备的发展已经越来越迅速移动web开发的需求也越来越多多。许多大平台、大门户都纷纷推出了自己的移动web版网站

随着移动设备飞速的发展，移动产品的屏幕規格越来越多从几年前的320x240像素的屏幕，到现在分辨率的屏幕各种分辨率的屏幕让前端开发的人们叫苦连连，如何使用一种有效的方式來解决各种屏幕分辨率下的用户体验呢

一、判断媒体类型，引用不同的样式表

通过设定屏幕的判断条件调用对应的css文件。该实例多用於整页面不同风格的css调用与选取使用该方法可能需要为一个页面制作多份个css文件。

上述实例可以出现在外部样式表与内部样式表中直接在样式表中以@media screen属性标注媒体类型的判断事件，在括号中写出判断条件为max-width:240px；该判断的意思是屏幕宽度大于240px则执行大括号内的样式属性如果小于240px则不执行。

前端开拓者做了@media screen相应的判断尝试并在首页与文章列表页加入了@media screen的功能实例。判断样式书写如下：

如果用户使用分辨率寬度大于1200px的浏览器访问网站则页面呈现为三栏模式，如下图：

如果分辨率小于1200px则页面会呈现为两栏模式如下图：

建议在使用判断时，洳果只是在样式表内进行判断的话可以修改部分重要样式来达到修改布局的目的。

通过@media screen与width条件判断可以事先对页面的宽度进行策划，嘫后根据不同的页面宽度设定不同的css样式有效的控制web页面在各种分辨率下的样式表先。

我要回帖

更多关于 open window 的文章

 

随机推荐