作者Rosalina (罗莎莉娜)
看板Web_Design
标题[问题] app的图片尺寸
时间Tue Feb 25 10:34:11 2014
做好app里面要用的图..上传之後..朋友的手机看到图片会被裁掉
我的手机的话图片就是完整的
例如做1020 780大小的图 ,如果字靠边一点的话就会裁到
(好像会依手机不同来决定大小)
所以这样子的话图片也不能做有相框、边框之类的设计@@
想请教这样子应该怎麽处理呢? 请多指点,谢谢大家!!
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 59.115.55.241
1F:推 wlwillwell:针对img做class命名,然後载入行动装置用的css 02/25 11:23
2F:→ wlwillwell:对该class以比例设定width与heigth就可以了 02/25 11:24
太感谢了 !!︿︿
请问是不是这个语法呢
----------------------------------------------------
@media screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
#myImg {
width:70%;
}
}
-----------------------------------------------------
<meta name="viewport" content="width=device-width, initial-scale=1,
maximum-scale=1, user-scalable=0">
/* iphone */
@media only screen and (min-device-width : 320px) and (max-device-width :
480px) {
img { max-width: 100%; }
}
/* ipad */
@media only screen and (min-device-width : 768px) and (max-device-width :
1024px) {
img { max-width: 100%; }
}
※ 编辑: Rosalina 来自: 59.115.55.241 (02/25 13:04)
3F:推 wlwillwell:是的,关键即是max-width:100%这个部分 02/25 16:45
4F:→ wlwillwell:不过要注意外层包的区块不要以pixel设定宽度,然後超过 02/25 16:46
5F:→ wlwillwell:不然内层的img{max-width:100%}会以外层为基准长大 02/25 16:46