• 关于

    响应式布局

    的搜索结果

问题

大家怎么理解自适应与响应式

最近做了一个响应的网站,但是lead只给了一套1080px的PSD;说是要响应式,可以用Bootstrap或者Foundation;一番折腾之后,我决定自己写一套响应式的样式。我发现一些问题:1,响应式网站最起码需要三套设计以分别适应mob...
a123456678 2019-12-01 19:27:23 1044 浏览量 回答数 1

问题

如何创建响应式布局?

如何创建响应式布局?...
珍宝珠 2019-12-01 22:03:04 41 浏览量 回答数 1

回答

1、采用响应式布局:什么是响应式布局设计2、利用js去识别移动端,然后调用对应的CSS:js区分移动设备和PC访问站点
杨冬芳 2019-12-02 02:31:15 0 浏览量 回答数 0

阿里云试用中心,为您提供0门槛上云实践机会!

100+款试用云产品,最长免费试用12个月!拨打95187-1,咨询专业上云建议!

回答

是你理解错了。你混淆了自适应布局和响应式布局。显然,@PortWatcher 的回答也把两者混淆了,或者说是不全面。--------- 更新 -------起初,网页设计者都会设计固定宽度的页面,最开始的电脑显示器分辨率种类不多,因为当时电脑本来就少,即使有变化也是 800 850 870 880。后来随着显示器越来越多,以及笔记本的普及,这种方式的页面出现了问题。于是出现了一种新的布局方式宽度自适应布局。我们平时谈论的自适应布局,大多指的就是宽度自适应布局。在这种布局下,出现了两派:百分比宽度布局流式布局题主说的是第一派,宽度使用百分比,文字使用 em。第二派的布局以 iGoogle 为代表(已经停止)。再后来,浏览器大战 时代,firefox、Oparo、Chrome …… 出现,结束了 IE 一统江湖的局面,N 年没有更新的 IE6 发布了新版本,以前已 IE 为标准的 CSS 向 W3C 标准趋近,随后各种针对浏览器的 css hack 技术出现。虽然浏览器这么多,但是响应式布局依然不是主流,人们还在使用 css hack 技术。注意我的用词——「不是主流」,虽然不是主流,不代表当时不被使用。比如一向超前的伟大的 Google。当时没有响应式布局这个词语,但是慢慢出现了一个词——渐进增强,新词的出现总是伴随的旧词一起出现。就好比 3G 出现之前,没人管自己的手机叫 2G,所以,3G 和 2G 两个词是一起出现的(技术上当然2G技术先出现)。同理,渐进增强出现后,另一个词「优雅降级」也随之出现了。词的意思可以自己看 wiki、Google,我只在这儿举一个例子,gmail 和 qqmail。他俩的宽度都是 100%,都是自适应。但是:qqmail 就是 css hack 的完美体现,你用任何一个浏览器,几乎可以看到同一个样子的邮箱,腾讯的前端工程师们用各种 css hack 技术来展示邮箱页面,为的是统一的用户体验。而 gmail 使用了渐进增强,你的浏览器越强,你看到的效果就越好,用户体验就越好。再后来,就是大家都熟知的 Google 发布了 android,于是互联网大战从 PC 打到了手机。还有 HTML5 标准的发布。手机虽然屏幕变小了,但是却提供了更丰富的功能。还记得以前用诺基亚上 QQ 的事儿吗?我们访问的是 3g.qq.com,当时我使用的是中兴的手机,访问 wap.qq.com,在后来的职能手机都是访问 m.qq.com。不禁有人问「真的需要为每个手机分别设计一个网页吗?」、「真的需要为手机和电脑设计不同的网页吗?」,解决方法当然有很多种,可以看看 css zen garden 相信做过前端的都看过这个网站,一个神奇的网站。最终的解决方案胜出者是响应式布局。响应式布局被大家熟知的一个重要原因就是 twitter 开源了 bootstrap。Google 第一次完成了从先驱到烈士。
a123456678 2019-12-02 02:21:12 0 浏览量 回答数 0

回答

还没把握到你提出问题的关键点,不过看你似乎是要考虑响应式布局,处理响应式布局中背景可以看看这个博客里面的技巧,很独特的方法 http://ju.outofmemory.cn/entry/22712
杨冬芳 2019-12-02 02:52:46 0 浏览量 回答数 0

问题

移动端浏览器会下载和加载隐藏的元素么?

在做响应式布局时,对页面加载速度的影响怎样的?移动端浏览器会有相应的优化策略么?对于移动设备,隐藏的元素,如果也会同样加载又隐藏的话,那不是会拖慢页面加载速度么?下载隐藏的图片岂不是会浪费流量?小白求解惑...更新一下:现有网站使用了响应式...
杨冬芳 2019-12-01 20:06:55 936 浏览量 回答数 1

问题

求推荐几本关于 网页页面布局方面的书籍

求推荐几本 关于页面布局(div+css布局/自适应布局/响应式)方面的书籍,不需要多一到两本好书就可以了。谢谢...
杨冬芳 2019-12-01 19:43:08 1116 浏览量 回答数 1

回答

其实阿里云自助建站本身就是一种CMS建站,只是这种CMS是阿里云自创的,没有开源出来而已,你在阿里云建站产品详情页面里可以详细了解到。 你说阿里云自助建站不是响应式布局、不支持SEO,其实阿里云自助建站是响应式布局的,也在SEO方面做了优化,详情参考官方文档:云.速成美站帮助文档
chensuns 2020-07-12 21:43:11 0 浏览量 回答数 0

回答

响应式设计和自适应设计都以提高不同设备间的用户体验为目标,根据视窗大小、分辨率、使用环境和控制方式等参数进行优化调整。 响应式设计的适应性原则:网站应该凭借一份代码,在各种设备上都有良好的显示和使用效果。响应式网站通过使用媒体查询,自适应栅格和响应式图片,基于多种因素进行变化,创造出优良的用户体验。就像一个球通过膨胀和收缩,来适应不同大小的篮圈。 自适应设计更像是渐进式增强的现代解释。与响应式设计单一地去适配不同,自适应设计通过检测设备和其他特征,从早已定义好的一系列视窗大小和其他特性中,选出最恰当的功能和布局。与使用一个球去穿过各种的篮筐不同,自适应设计允许使用多个球,然后根据不同的篮筐大小,去选择最合适的一个。
茶什i 2019-12-02 03:17:13 0 浏览量 回答数 0

回答

最佳回答 其实阿里云自助建站本身就是一种CMS建站,只是这种CMS是阿里云自创的,没有开源出来而已,你在阿里云建站产品详情页面里可以详细了解到。 你说阿里云自助建站不是响应式布局、不支持SEO,其实阿里云自助建站是响应式布局的,也在SEO方面做了优化,详情参考官方文档:云.速成美站帮助文档 更多参考地址: 阿里云官方(新用户需官网注册查看)
游客g36eh4twnccbg 2020-11-05 18:08:57 0 浏览量 回答数 0

回答

响应式布局的核心是把页面布局按照比例来拆分,并使用相对单位,例如 rem,% 等等。
云翮 2019-12-02 03:22:57 0 浏览量 回答数 0

问题

H5响应式网站对SEO优化的影响

H5响应式网站的SEO优化的效果更好!你知道吗?而且H5响应式网站的搭建也很方便,无论是企业还是个人都可直接借助H5自助建站系统轻松完成网站的搭建,还不用懂代码、写编程,...
建站宝盒 2019-12-01 22:05:10 2444 浏览量 回答数 0

回答

移动端访问就没有响应式功能因为手机事件与浏览器不同需要开发移动时间相关。为了避免网站的缩小版,开发可用性高的移动页面布局上也不能和PC一样最好针对移动端设计布局。
渔篁 2019-12-01 23:24:58 0 浏览量 回答数 0

回答

bootstrap对很多的设计师来说确实是有抵触心理的,个人认为源头是目前国内多数设计师是“平面设计师”而不是“网页设计师”,对网页尤其是现代的响应式的网页其实并没有足够的理解。我个人的做法是大布局(比如大侧边栏的宽度)尽量精确(必要的话放弃grid布局),但局部看上去是n等分的就用grid,然后告诉设计师你的PSD画歪了,不平均,我实现成平均的了这样说回bs,断点的设定是参考主流屏幕的,1200和992对应1280和1024两种主流分辨率(需要扣除滚动条等),每grid的宽度是声明成百分比的,代码中并没有62.5px之类的数字,而是8.33% 16.66% 25%这样的百分比,也就是所谓的“流式布局”,也只有这样才能声明一组grid类适用于任意层级的嵌套至于自己修改参数,当然不会有任何问题,实际上bs是鼓励自定义参数的,响应式的边界,container尺寸,grid个数和间距等都可以自己调整。甚至可以直接摈弃bs的grid自己引入另一套grid框架也没问题
a123456678 2019-12-02 02:23:21 0 浏览量 回答数 0

回答

使用100%响应式布局,flex,rem
渔篁 2019-12-02 02:32:42 0 浏览量 回答数 0

问题

关于移动端网页布局问题。

第一次做移动端有点蒙对响应式有一定了解,是个微信公众号页面应该和移动端的一样吧,这种样式的怎么布局呢,我想的是大的div width:100%; height:30px; 两个图左右浮动,input是margin:0 auto;但是没有效果...
杨冬芳 2019-12-01 20:09:29 855 浏览量 回答数 1

回答

bootstrap3是移动优先,兼容性可以开启响应式布局和流模式
杨冬芳 2019-12-02 02:35:53 0 浏览量 回答数 0

回答

利用JS进行操作系统类型判断2,利用@media进行响应式布局设计
a123456678 2019-12-02 03:08:30 0 浏览量 回答数 0

问题

求 学习响应式布局比较好的网站和项目

求推荐几个,谢谢了!...
杨冬芳 2019-12-01 19:38:38 1035 浏览量 回答数 3

回答

你可以尝试使用响应式布局 bootstrap比较常用,我想应该可以解决你这个问题
youcongtech 2019-12-02 01:30:30 0 浏览量 回答数 0

问题

浅析响应式网站设计的用户体验

Web发展迅速,各种应用和服务层出不穷,现在打开电脑,可能使用最多的程序应该是浏览器了,访问不同的网站,可以满足人们购物,社交,获取新闻资讯&...
aizhan 2019-12-01 20:57:13 7537 浏览量 回答数 0

回答

经过几分钟的搜索,我认为自适应和响应式应该都是同一个东西:responsive web design(rwd)。我没找到哪个地方说自适应不是RWD或者响应式不是RWD的。实际上在维基百科,这两个词直接是混用的一般来说会和RWD混淆的是所谓的fluid grid,也就是用百分比进行页面布局。后者是前者的常用手段之一。我觉得一般来说如果要做responsive,大概是先搞定中间尺寸,也就是pad~small desktop这块然后搞定大尺寸,往往是水平方向延伸一些元素出去最后搞小尺寸手机,这块一般比较复杂,经常需要JS辅助。比如把侧边栏改造成菜单按钮的弹出菜单,比如导航的重新设计等等。
a123456678 2019-12-02 02:21:28 0 浏览量 回答数 0

回答

Re哟,官网界面改版了嘛 响应式布局  似乎是1200最大宽度,1000最小宽度
jjonline 2019-12-02 01:24:27 0 浏览量 回答数 0

回答

IE6我倾向于用温和的态度对付。用最小的精力,对IE6做最低限度的容忍。1.肯定做完再改。2.只维持IE6下最低程度的“正确”:不丢字、排版不出大的错位、重要功能不丢失。3.不追求样式一致。小的尺寸错误不管,样式不好IE6兼容的就退化处理。4.响应式也牺牲掉,IE6下只保证浏览器宽度够宽的时候说得过去就行。甚至可以把响应式的布局,IE6下通通退化成传统的px定宽布局。5.主要使用IE6条件注释和hack。hack手段主要是双下划线。6.表态抵制IE6并教育用户升级。我选择在网页页脚区的上边,插入一段黄底红字的提示。这样不影响网页正文区,又不妨害自己表态。7.如果像sf一样,受众比较“高科技”,不应该再用IE6来访问,则以上的IE6兼容都不做,并在网页的第一屏幕就提示。这里的提示不要吝惜嘲讽性的语言。例如:“如果您不是程序员中的垃圾货色,就不应该再使用IE6上网。如果您在公共场合,请用以下链接下载一个便携版浏览器(解压即用):Firefox, Chrome”。8.js方面,如果要IE6兼容,基本靠使用jQuery 1.x解决,简单省事。
杨冬芳 2019-12-02 02:47:23 0 浏览量 回答数 0

问题

怎么实现多列的响应式布局?

就是这种,不过其中的红色元素是根据父元素自适应的,每一行的第一个和最后一个元素紧贴父元素,这种应该怎么写,我现在用的css3的flex属性写的,感觉会有兼容问题,大家有更好的方法吗...
a123456678 2019-12-01 19:31:55 796 浏览量 回答数 1

问题

怎么样使Bootstrap固定在底部的导航栏只在手机端显示呀?

请教各位大神啦, 怎么样使这个导航栏只在手机等移动浏览器上才显示,而电脑浏览器不显示呢? bootsrap是否直接支持这种响应式的布局呢? 在浏览器窗口缩放的时候, 或者是移动设备浏览器的时候,能够把这个靠下的导航栏显示出来...
a123456678 2019-12-01 20:22:51 1422 浏览量 回答数 1

问题

如何让web页面根据客户端尺寸自动缩放?

比如做的页面是固定尺寸640px(包括背景图片等都是固定尺寸),如何让其在320px尺寸的手机上显示为320px大小?也就是字体图片等都为正常的50%,而不出现滚动条等?更新:不是想要bootstrap那种使用@media的响应式布局效果,...
a123456678 2019-12-01 19:30:22 1026 浏览量 回答数 1

回答

webview布局的时候没弄好,或者你的activity已经设置成了不显示title。######mate属性有个是设置缩放的,需要那个参数.你加上就好了.做成响应式布局就行了.######推送的消息应该不是网页格式吧,当点击后才是网页效果######点击的就是一个网址,在微信中浏览器插件中打开######webview也是一个控件,在activity的布局xml文件中做好布局###### 呵呵,不知道是不是我没说清楚了,不过,还是谢谢大家,问题解决了,原来是我继承错了一个类导致的,加上下面的即可,我起先是继承了WebChomeClient而不是WebViewClient,所以一直实现不了我要的效果。  mBrowser.setWebViewClient(new WebViewClient(){  //网页链接用本浏览器访问       @Override    public boolean shouldOverrideUrlLoading(WebView view, String url) {     view.loadUrl(url);     return true;     }      });   ######微信公众平台API提供url功能
kun坤 2020-06-01 09:50:34 0 浏览量 回答数 0

回答

一般是两种情况:1.(伪不同)同一套页面,使用响应式布局。访问时根据设备的宽度控制内容的排列,电脑屏幕大,所以内容横着一排4、5个,不用滚动就能显示全部内容。手机屏幕小,所以内容一个占一排,通过滚动查看全部内容。这种方式只是看起来布局会不同,但手机和电脑收到的数据没有任何不同。通过html+css+js就可以实现。1.不同的页面,通过判断浏览器User-Agent为客户端发送不同的页面。访问时根据设备的类型进行判断,判断为手机时,使用 重定向,或者服务器内部跳转让手机和电脑收到的数据不同。这种方式手机和电脑收到的数据是完全不同的,所以可以展示不同的内容。一般是通过服务器后端代码处理。通过重定向的方式实现的话,可以用js实现
杨冬芳 2019-12-02 02:56:48 0 浏览量 回答数 0

问题

关于响应式布局,bootstrap

在网上看到的这个概念,这里是链接感兴趣的童鞋可以看看:http://www.ruanyifeng.com/blog/2012/05/responsive_web_design.html不是讲到说什么width啊,margin啊后面跟的都不可...
a123456678 2019-12-01 19:27:03 910 浏览量 回答数 1

云产品推荐

上海奇点人才服务相关的云产品 小程序定制 上海微企信息技术相关的云产品 国内短信套餐包 ECS云服务器安全配置相关的云产品 开发者问答 阿里云建站 自然场景识别相关的云产品 万网 小程序开发制作 视频内容分析 视频集锦 代理记账服务 阿里云AIoT 阿里云科技驱动中小企业数字化