一,应用场景
移动应用app终端,需要定制一些活动页面,开展运营类的活动。可以使用jsp定制活动页面,使用css样式适配不同终端的屏幕大小。
二,css适配样式
css适配样式如下:
//适配手机屏幕宽度<=330px的手机 @media screen and (max-width:330px) { body { font-size: 32%;} } //适配手机屏幕宽度>=331px<=350px的手机 @media screen and (min-width:331px) and (max-width:350px) { body { font-size: 32%;} } //适配手机屏幕宽度>=351px<=365px的手机 @media screen and (min-width:351px) and (max-width:365px) { body { font-size: 32%;} .container {width: 340px;} .trans-info {width: 240px;} } //适配手机屏幕宽度>=365px<=400px的手机 @media screen and (min-width:365px) and (max-width: 400px) { body { font-size: 32%; } .container {width: 370px;} .trans-info {width: 260px;} } //适配手机屏幕宽度>=400px的手机 @media screen and (min-width:400px) { body { font-size: 32%;} .container {width: 380px; } .trans-info { width: 280px;} }