社区
HTML5
帖子详情
小白求教。。。
流浪汉_
2016-03-11 04:20:58
下图的布局方式如何实现?
切图切出了1960像素的图片,自己布出了下面的效果。。- -。。
如何让顶部的图片根据浏览器的大小自适应呢?。。
...全文
152
3
打赏
收藏
小白求教。。。
下图的布局方式如何实现? 切图切出了1960像素的图片,自己布出了下面的效果。。- -。。 如何让顶部的图片根据浏览器的大小自适应呢?。。
复制链接
扫一扫
分享
转发到动态
举报
写回复
配置赞助广告
用AI写文章
3 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
业余草
2016-03-14
打赏
举报
回复
1.width:100%; height:100%;
100%放大
2.repeat-x;
平铺
3.响应式设计
media
业余草
2016-03-14
打赏
举报
回复
图片分为背景图片和通过img标签引入的图片,前者可以通过media query自动的切换不同分辨率的版本,但是在不支持background image size的浏览器中背景图片无法无级的调整大小(也就是在media query切换css的点上可以换一张不同分辨率的图,但是没法儿获得两张分辨率中间大小的版本),而且在很多情况下(比如cms中)并不适合用背景图片。 如果是img标签引入的图片,可以使用延迟加载的方式来加载,在实际加载图片之前先用js检查窗口宽度,然后加载不同分辨率的图片,比如宽度<=480,就加载80px宽度的图片,480 < 宽度 <= 768,加载120px的图片, 宽度> 768则加载160px的图片,如果宽度是600px怎么办呢,通过百分比来缩放120px的图片达到合适的结果。 这样做的好处是对于移动设备来说,下载的图片会小一些,减少网页加载的时间。但是问题是竖屏向横屏切换或者扩大浏览器窗口宽度时图片会由于放大而产生一定的模糊感。 响应式设计中对于图片的考虑应该从布局设计就开始,尽量使图片在各个窗口宽度下的尺寸不要相差过大,通过排布更多的内容而不是扩大图片的尺寸来填充由于浏览器窗口扩大带来的空间。这样可以有效的减少图片放大模糊的问题。
SecretCastle
2016-03-13
打赏
举报
回复
background-size
the end效果.ppt
小白
试水,
求教
大神,第一天注册,还未能好好学习,期待进步
接口老是变!2023年微信小程序最新获取头像onChooseAvatar的方法
小弟虚心
求教
,大神勿喷请多多指点赐教; 1通过onChooseAvatar绑定button事件点击获取头像返回临时头像链接; 1.1分别定义了全局和缓存了头像临时Url(因为毕竟是临时链接,后续可以传服务器生成永久链接,这样就...
产品经理必备的产品思维
产品经理入门互联网企业所必备的产品思维: 1.像哲学家一样去思考本质; 2.像婴儿一样保持好奇心; 3.像运动员一样去锻炼修行; 4.像
小白
一样虚心
求教
。
SVN 使用介绍.pptx
当工作团队中没有使用版本控制工具的时候,对于共享文件的操作会存在很大的麻烦,有了版本控制工具,团队中的每个人都可以放心的操作每一个文件,而不必担心自己的操作影响...
小白
一枚,欢迎大佬指正错误,虚心
求教
谢谢
荣辰辰---二进制信息熵docx.docx
用matlab绘制二进制信息熵,word内附原代码,运行截图等
HTML5
39,084
社区成员
5,548
社区内容
发帖
与我相关
我的任务
HTML5
HTML5是构建Web内容的一种语言描述方式。HTML5是互联网的下一代标准,是构建以及呈现互联网内容的一种语言方式.被认为是互联网的核心技术之一。
复制链接
扫一扫
分享
社区描述
HTML5是构建Web内容的一种语言描述方式。HTML5是互联网的下一代标准,是构建以及呈现互联网内容的一种语言方式.被认为是互联网的核心技术之一。
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章