求HTML页面图片自动适应不同分辨率屏幕的代码,希望大神写清楚一点,图片应该加在哪里,整段代码加在哪里

我要加的后台是微商城后台。... 我要加的后台是微商城后台。 展开
 我来答
奥力给2023
2015-10-27 · TA获得超过2164个赞
知道小有建树答主
回答量:731
采纳率:67%
帮助的人:384万
展开全部
图片自适应屏幕浏览器的方法有两种形式:
第一种也是最方便的:把图片设置成百分比,用百分比来控制,比如你的格局,在div中,分两个区域每个区域有50%大小,占用整个屏幕的大小,然后你在一个div中的图片设置100%,他只是占了整个屏幕的50%的,如果设置50%,那么他占用的是25%,根据上一级的区域来设置的;这样拖动浏览器的时候,也会根据浏览器缩放来自动变换大小;
第二种,相对来说麻烦一点,需要你来判断,这样的比较灵活,也可以随着浏览器的大小变动字体等大小;
@media screen and (max-width:360px){body{img:100%;}}
这是给你举个例子,当然css样式需要你自己来写,设置最大宽度 max-width与最小宽度min-width;上面的意思是当浏览器宽度小于360px的时候执行body内的css样式
@media screen and (min-width:480px){body{font-size:21px}}
这种方式是当浏览器宽度大雨480px的时候执行body内的css样式
希望我的回答对你有所帮助,如果还有疑惑请继续追问我;
追问
我的把代码发私信给你了,谢谢帮我看一下,怎么处理,感谢!
追答
图片自适应的话,你的上一级不能是设置的固定宽度与高度;最好用width:100%; height:100%;或者height:auto;都可以
看私信,我给你发下
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式