Responsive design 响应性网站在iPad纵向平板电脑视图中仅占据半个屏幕

我们正在制作一个响应性强的网站,在客户的iPad上,开发网站只占据了一半的屏幕,浏览器缓存已被清除-见下面的屏幕截图:- 这种情况发生在使用Chrome的iPad上 我无法复制我的终端,该网站正在每个用户代理/浏览器中按我们的意愿显示 你知道是什么原因导致客户iPad出现这种情况吗?我实际上是从客户那里得到的,但鉴于我依赖客户来确认是否有任何改变解决了问题,因为我们无法自己复制问题,我们已经发布了我们自己的问题 <meta name = "viewport" content = "widt

Responsive design 将一个普通站点转换为支持WAP的站点需要多少工作?

我以前制作过响应性网站(很多次),但这一次,我被要求制作一个支持WAP的网站版本 我做了一些研究,但对这意味着什么只有一个模糊的概念:它仅仅是另一个响应版本(用WML和HTML编写的单独视图),还是更大的版本,比如一个完全不同的网站副本?-看起来你在说必须支持非常小的屏幕大小、低内存的移动设备。。。因此,不要只是隐藏页面的一部分,只从服务器返回基本信息,尽量减少javascript操作等。如果你真的需要WAP站点-那么是的,你应该只返回小页面,而不是HTML,但实际上-这是传统技术,也许他们只需

Responsive design 图像上的文本悬停在响应网格中

我制作了这个响应性强的图像网格。 ol,ul{ 列表样式:无; 线高:0; } .项目主容器{ 宽度:100%; } .project_容器{ 浮动:左; 宽度:33.3333333333333333%; 背景尺寸:封面; 溢出:隐藏; } .project_图像{ 宽度:100%; } @仅介质屏幕和(最大宽度:1000px){ /*一排两个盒子*/ .project_container{ 宽度:50%; } } 每幅图片都代表了我所做的一个设计案例。我希望每

Responsive design 如何使yui2响应

我正在使用yui2(我知道它现在已经存档了,但我有过这个版本的实践经验,由于截止日期很紧,所以没有时间学习yui3)在我的项目的一些页面中。没有yui列表的页面使用响应式css对移动视图做出响应。但是现在使用yui 2设计的页面没有响应。我想知道我是否可以添加代码行以使其能够响应。请帮助。yui与否,您可以使用纯css网格:我找到了解决方案: 遵循此处给出的步骤: 在提供的css中,用#uryuidivname表替换表td等,#urdivname td亲爱的@user3129262:该表是根据服

Responsive design 聚合物项目1.0的第一页中使用的聚合物元素是什么?

我想在polymer project 1.0的第一页创建一个具有类似行为的页面 它是有责任的 我正在使用 <paper-header-panel> and <paper-toolbar> 和 ,但我没有发现这种行为 我不想要左边的抽屉,就像工具箱里建议的那样 我怎样才能在聚合物元素中获得这种行为(聚合物项目的第一页) 谢谢 他们在代码中使用媒体查询来显示和隐藏工具栏 从中看到它 好的,明白了!但是我想找到可以用于这种行为的组件(铁纸-?)。类似于bootstra

Responsive design 谷歌Adsense响应广告单元有时会在移动视图中造成空白

我正在使用Adsense推荐的响应式广告单元制作我的响应式网站排行榜广告。该单元的数据广告格式设置为水平矩形 对于桌面视图,广告始终以排行榜的形式显示。但对于移动视图,广告有时显示320×100填充空间,但有时显示较小尺寸的移动广告单元在其下方留下空白,因为Adsense没有将其容器div和iframe的大小调整为小于100px,而是将高度设置为100px 我自己的广告单元容器div没有设置任何高度,因此它可以调整大小以适应任何大小的广告。请参见下面的屏幕截图。我不想看到广告下面的空白空间,并且

Responsive design 基础邮件:制作 嘿,伙计们,我刚刚开始创立基金会,真是太棒了。

我只是很难想出一个电子邮件设计。见下图: 我想设计那些面板,所以我想我应该使用标注。然而,在较小的屏幕上,间距和图像都很奇怪。这是 非常感谢您的帮助。谢谢 这已被修复。决定使用常规表格代替标注。在较小的屏幕上效果如何?你能提供一个屏幕截图吗?

Responsive design 使用Appcelerator Tianium框架的响应式UI设计

我是Appcelerator框架的新手,我在Appcelerator中开发了一个应用程序,但该应用程序在IOS上看起来不错,但在android上看起来不太好。 我想开发一个像html一样响应迅速的屏幕。 有没有办法像响应屏幕一样设计appcelerator屏幕 谢谢。除非经过计算,否则不要定义宽度。iOS非常简单,只有几个不同的分辨率,在Android上你永远不知道你可能会遇到什么分辨率 幸运的是,您可以在Tianium中指定不同于HTML的宽度。比如说 var view = Ti.UI.cre

Responsive design 防止vuetify侧导航抽屉与页面内容重叠

我试图防止vuetifyv-navigation-drawer与页面内容重叠 如何以响应方式将v-main内容居中 我猜您要查找的是导航组件的app属性 只要移除它,你就会得到预期的结果 <v-navigation-drawer permanent mini-variant expand-on-hover left > 我猜您要查找的是导航组件的app属性 只要移除它,你就会得到预期的结果 <v-navigation-drawer pe

Responsive design android手机右侧显示空白的网站

我的网站在iOS和浏览器中运行良好,但在右边的android手机中显示空白。尝试了许多css编辑,但这并没有消失 有人能帮忙吗 提前谢谢。想好了 在CSS中添加了这段代码,一切都得到了修复 /android的视口设置/ html{宽度:100%;溢出-x:隐藏;!重要;} 正文{宽度:100%;溢出-x:隐藏;!重要;} 谢谢

Responsive design 全宽、响应灵敏的顶部图像

我正在尝试创建一个标题,标题中的图像会响应屏幕大小,如下所示: 他们是怎么做到的 <div id="banner" style="width:auto;overflow:hidden;"> <img src="..." style="width:100%;" /> </div> (只是为了演示而内联使用,但当然可以是类) (只是为了演示而内联使用,但当然可以是类) @media handheld, only screen and (max-width: 40

Responsive design Zurb基金会4手机VS桌面内容 我是Zurb基金会的忠实粉丝。他们刚刚发布了ZURB基金会4,它被重新设计为移动第一。我对兼顾手机、平板电脑和传统桌面体验的响应式设计还比较陌生。我正试图思考如何最好地管理这些不同设备的网站内容。使用ZURB基金会4,您可以基于小、中、大设备大小隐藏或显示内容。因此,Zurb的方法似乎是将所有内容放到设备上,让CSS根据设备决定显示什么内容(这是一种响应性设计)

我的问题是,为什么我们必须将所有内容都放到设备上?这似乎是对服务器处理的浪费,对带宽的浪费,以及浏览器处理内容时的较慢体验,其中一些内容可能因为用户使用的设备而永远不会显示给用户。我错过什么了吗?回到服务器,让它向客户机发送适合设备类型的内容不是更好吗?我们是否应该关注移动用户的数据计划,而不是发送不适合其设备类型的内容?我在responsive design上看到的所有示例都将桌面和手机/平板电脑的内容下载到客户端,这似乎是一种浪费 我正在开发一个时间输入应用程序,它根据设备类型具有不同的用户

Responsive design 媒体查询元标记不工作

我正在开发一个快速响应的网站,当我在移动模拟器上查看网站并重新调整浏览器大小时,所有的响应都非常完美,但当我在实际的移动设备上查看时,网站不会调整大小 这是我的HTML头 <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="description" content=""> <meta n

Responsive design 引导3分区水平列表

我有一个水平div的列表,我不能让它们按我所希望的那样工作。 我想要达到的是拥有 对于md、lg、sm-一个包含任意大小图像的小“缩略图”类图像的矩形div列表,并水平继续使用用户名-如md视图中的示例所示 对于xs,我希望每个条目都位于另一个条目的下方,名称位于图像的下方,这应该是屏幕大小 我不能举例说明这个图像,因为我已经使用了太多的内联css 除非我误解了你的问题,否则看起来你离你要找的东西很近。。。只需将您的col-md-3更改为col-sm-3,就可以在xs断点而不是sm断点处切换

Responsive design 比响应性更好的工具

是一个很棒的网站,可以预览不同浏览器大小和方向的任何网站。 是否有类似的工具也支持迷你平板电脑?自Firefox 15以来,您有一个内置的Responsive设计工具,可从web Developer菜单访问 请参阅Paul Rouget。我使用它,它允许您控制精确的宽度,而不是提供固定的设备宽度。是一个jQuery插件,它与responsive.is站点的功能基本相同,只是您现在可以完全控制指定的尺寸 由于您直接将其加载到自己的域中,因此您不需要依赖其他人的正常运行时间,如果您的网站不公开(例

Responsive design WSO2企业商店1.0.0:商店设计

WSO2 ES有一个优雅而吸引人的门户来浏览商店。但它缺乏根据设备尺寸调整布局所需的响应性设计 我知道代码是完全可定制的。但我认为这需要更多的文档 您是否正在为未来版本开发新的设计?目前ES仅支持平板电脑级别,我们的路线图中已经有了对小型设备的支持,我们正在进行这方面的工作 您可以在这里找到ES源代码[1],构建并尝试改进,而无需等到下一个版本。您可以在[2]或[3]报告问题/功能 [1] [2] [3]

Responsive design 原子设计,有机体中的有机体?

原子设计似乎是构建用户体验结构的一种有趣的方法。但是一个有机体能包含其他有机体吗?根据原子设计的这一实现: 生物体是一组原子、分子和/或其他生物体: 是的,将一个有机体包含在另一个有机体中是完全可以的 生物体实际上是:一组原子、分子和/或其他生物体

Responsive design 基于浏览器查看端口或实际屏幕大小的响应式Web应用程序设计?

昨晚我和一位做桌面开发的同事聊天,他问我为什么我的反应基于浏览器视口,而不是像他那样基于显示器的实际大小 我正在使用 $(window).height(); $(window).width(); 和CSS媒体查询 因此,我的问题是,哪种方法是构建响应性web应用程序的正确方法,而不是网站,因为我眼中的网站不同,我们应该使用浏览器视口还是使用实际的屏幕大小

Responsive design bootstrap 3上定制导航条的移动响应能力

我已经搜索了一段时间了。我是y=使用Bootstrap3的惊人响应能力,一切都很顺利,直到我在移动设备上使用Veywd时尝试将导航栏折叠。我遇到的问题是,切换导航的按钮似乎根本不起作用。我想这可能是我的订单,但我只是不知道 这是我的代码--> 头标签中的内容-------> ---------- 看起来这里有很多错误 我看不出在bootstrap.js文件之前包含jQuery 看起来您两次包含boostrap.js文件。。。你只需要一个 您在两个元素navcol上具有相同的id。ID必须是唯一

Responsive design 如何使报表查看器控件响应

要在模型弹出窗口中打开包含页面的“我的报告查看器”。当我最大化模型弹出屏幕时,所有容器div都按照屏幕宽度来计算宽度,但是报表查看器没有响应 是否有任何机构可以建议有关此问题的解决方案您应该尝试此解决方案 缩放:将报表缩放值设置为整数百分比或字符串常量。标准字符串值包括页面宽度和整个页面。早于Internet Explorer 5.0的Internet Explorer版本和所有非Microsoft浏览器将忽略此参数。此参数的默认值为100。 例如,在本机模式下: 参考: http://myrs

Responsive design 移动设备上的响应电子邮件模板问题

我有一个反应灵敏的模板,它可以完美地工作,无论何时我在任何宽度上重新调整它的大小,它在PC上都非常出色。但当我在安德里欧手机上看Gmail时,它没有反应。我的电子邮件模板已将所有适当的媒体查询和宽度设置为100% 我想不出一个解决办法。如果有人给出一个永久性的解决方案,这将非常有帮助 如果有人想查看该文件并给出解决方案,请点击此处: 提前谢谢你安卓上的Gmail不支持媒体查询。你知道其他解决方案吗?不,目前根本不支持:确保你最大的表有style=“min width:[width]px”这样G

Responsive design 汉堡包菜单没有出现

我已经用联系人表单创建了一个联系人页面,但当我在移动设备上预览网站时,我的汉堡包菜单不会出现。汉堡包在其他页面上工作,除了第一页。这是我的代码: <!DOCTYPE html> <html> <head> <title>Contact</title> <meta charset="utf-8"> <meta name="description" content="Arina Matvee

Responsive design 我的网站是否有响应性有关系吗。如果我用投影仪显示网站?

所以我必须给一个我制作的网站做一个演示。所以我没有时间让它响应。我使用了位置:相对和px单位作为边距和全部。如果我在windows 10 project中使用“复制”选项,它会改变网站的布局吗?如果投影仪的分辨率类似于普通电脑屏幕,它不会有什么不同。问题是,在演示之前我不知道,但通常投影仪的分辨率类似于电脑显示器(即,绝对不类似于移动设备…)。如果您的代码不包含通常的“视口标记”以使其响应,则网站很可能会缩放到投影仪的大小,因此您可以想象您的网站届时会是什么样子。

Responsive design 小屏幕基础显示尺寸

我使用的是一个显示模式,但我发现-如文件所述-在小屏幕上,显示是屏幕宽度和高度的100%,而我需要一些空间。。。有什么想法吗 谢谢您没有提供任何代码或进一步的详细信息 您可以在展示上使用以下类,也可以根据需要创建自己的类: 微小的 小的 大的 满的 在小屏幕上,模式始终为屏幕宽度的100%。在中型和更大的屏幕上,宽度更改为600px(请参阅$REVEL WITH设置) 我也有同样的问题。基金会的揭幕让所有“小”情态动词全屏播放。我想在某些情况下禁用这个特定的模态。我查看了设置文件,似乎没有

Responsive design ZURB基金会5不工作在IE 10? 我一直在等着转到基金会。现在我们终于接近IE10(@μ$和%^?!),主要基金会网站甚至不在IE10中工作。几个月前,基金会4肯定是很好的。我错过了什么吗?

IE 10设置为兼容模式。基金会5用IE10解决问题很好。这个问题似乎是偏离主题,因为它只是一个咆哮。不,我只是想看看ZURB基金会5是否与IE10合作。当我访问主网站时,它在Chrome中运行良好,但在IE10中却不行。我的IE没有做任何特别的事情,一切都是标准的。真的想知道基金会是不是一个选择。为什么所有的负面和要求关闭?我只是想问一下基金会5是否在IE10中工作。它不在我的机器上,不知道我是否错过了什么。有人知道答案吗?谢谢

Responsive design 如何处理新的iMac尺寸以实现响应性网页设计?

有很多关于媒体查询的文章都是为了把手机放在第一位,然而,我很少读到关于优化大屏幕电视,特别是新的iMac的文章。这里的尺寸要大得多。从13英寸MacBook pro到大型iMac,人们在小型移动设备、中型平板电脑和台式机上使用的标准是什么 一些评论 Mobile first并不排除大型设备。可以将其视为从小屏幕移动设备的基本设计开始,然后添加更多功能,并在智能手机、笔记本电脑和桌面设备的升级过程中构建设计 对于较大的视口,它不必过于复杂。考虑增加字体和图像大小,这样您就有足够的水平空间,可以在需

Responsive design 如何更改UI5中响应按钮的宽度?

我是一名UI5初学者,我想创建两个响应迅速的sap.m按钮。宽度应为每个按钮视图的50%。问题是,我真的不知道如何设置响应按钮的宽度 var oButtonNeuePal = new sap.m.Button({ icon : "sap-icon://add-document", text : "{i18n>lieferschein.btnNeuePal}", press : [ 'NEUEPAL', oController.onBu

Responsive design 指南针精灵和响应图像

我已使用指南针创建了一个精灵表: $roundedicons-layout:smart; @import "roundedicons/*.png"; @include all-roundedicons-sprites; 大约有11个图标,工作正常 当我需要用一个简单的include来调整类时,我也有一个部分: @包括响应(手机){宽度:100%;}适用于手机、平板电脑和桌面: $break-desktop: 1024px; $break-tablet: 720px; $break-phone:

Responsive design 使用媒体查询重新订购容器

我想在特定设备上查看网页时重新订购一些容器 我现在有三个div在左边浮动。两个较小的div位于较大div的两侧。但是,当媒体查询开始时,a希望三个div中间的一个位于其他两个div之上。从理论上讲,将其位置从第二位改为第一位 这在纯CSS中是可能的吗?或者我需要让jQuery参与进来吗?我已经在这里为任何能帮助我初步尝试的人设置了一个测试小提琴,但到目前为止,我没有任何乐趣 HTML示例: <div class="panels"> <div class="panel-o

Responsive design DFP大小映射打破赞助关系

根据我目前的经验,DFP中响应性广告的sizeMapping()打破了赞助关系 例如,如果我这样定义尺寸映射: addSize([1024, 768], [970, 90], [728, 90], [320, 50], [300, 250]) 然后,我在一个特定的广告单元上设置了一个赞助,这个广告单元是728x90。 我还设置了一个运行站点(placement)970x90,其中包括所有优先级别较低的广告单元,包括赞助广告单元 结果是,由于sizeMapping变量,970x90将显示在赞助的

Responsive design 带carouFredSel.js的全宽响应旋转木马

我目前正在使用carouFredSel.js在我的网站上提供全宽旋转木马。我之所以选择这个插件,是因为它具有全宽功能,能够在屏幕的左右边缘部分显示上一个和下一个图像 我也在使用Bootstrap3,但没有成功实现相同的行为,所以我选择使用插件 我遇到的问题是使转盘响应。该插件有一个选项,可以通过在选项中添加“responsive:true”使其具有响应性,但当我这样做时,它会破坏布局 我的带有占位符图像的代码可以在中找到。我建议您在以下位置查看全屏结果: #简介{ 宽度:580px; 保证金:0

Responsive design CSS响应性网页设计:平板电脑上横向和纵向的最小宽度和最大宽度是否发生变化?

我正在修改一个网站的CSS,使其具有响应性。我准备开始向各地媒体提问,但我突然想到: 当您将平板电脑从纵向模式切换到横向模式或从横向模式切换到纵向模式时,媒体查询所使用的“宽度”属性(“最小宽度”、“最大宽度”等)是否会改变 这将帮助我确定我是否需要编写两倍于我需要编写多少套变体CSS的集。是的,它会改变。浏览器将始终根据显示宽度呈现内容,除非您告诉它不要这样做。这是有道理的。谢谢你的帮助!

Responsive design 钛应用程序中的相对屏幕

我是钛的新手,我使用的是合金。 我开发了一个应用程序,可以在分辨率为1200x1920的Android Nexus 7 emulator上正确渲染,但是在768x1280 emulator屏幕上渲染相同的代码时,我的所有控件都分散在一起,不再对齐。如何使应用程序响应屏幕分辨率 仅供参考:Genymotion不工作,因为它显示了更新视频驱动程序的问题,我稍后会检查 我的代码如下: var LeftTopView = Ti.UI.createView({ top:'0%', left:'0%', h

Responsive design 在响应性设计上表现出极大的差异

为什么个人电脑和手机网页的响应速度不同 我使用了以下代码来创建响应 <meta name="viewport" content="width=device-width" /> 在铬重定尺寸 在iphone5中 (1)仔细检查您确实在文档的头部包含了一个veiwport元标记,我在您发布的链接上没有看到它 <meta name="viewport" content="width=device-width, initial-scale=1.0"> (2) 我正在

Responsive design 平板电脑上的图片大小变化迅速

大家好 我已经在桌面上建立了一个网站,它应该是响应性的。当我想在平板电脑上测试时,图片开始改变大小,从大到小,从小到大。一台台式机一切正常,但在Ipad和Android平板电脑上,图片的大小一直在变化。它看起来很不稳定 如果有人知道这个错误或者知道在哪里寻找它,请告诉我。如果我能得到它,我将不胜感激。它与旁边文本框的大小有关。您应该接受自己的答案,或者删除该问题

Responsive design Chrome开发工具和设备模式解析

我目前正在开发的网站,并试图使其响应。对于测试,我使用ChromeDevTools设备模式,您可以在其中设置任何设备的分辨率 问题是,如果您选择例如1920x1080 px,并使用媒体查询为该分辨率正确设置样式,则不适合用户浏览器,因为用户必须以全屏模式浏览 有没有办法将设备分辨率设置为与给定分辨率浏览器的高度和宽度相匹配,或者有没有这样的样式设置的好方法 欢迎任何提示 不要使用媒体查询来获得精确的分辨率。通常,最好使用一个或一些“最大宽度”和“最小宽度”条件 一个好方法是为大、中、小屏幕定义媒

Responsive design 使用基础3的响应布局不能正常工作 我在使用基金会3创建网站的过程中,但我似乎无法得到响应的布局来工作。当屏幕大小改变时,导航栏似乎会做出响应,但网站的其他部分都不起作用。有谁能帮助我如何让网站的其余部分响应

您可以在此处查看: 任何帮助都将受到感谢 谢谢您的网站上有很多内容。我注意到的一件大事是,您将行嵌套在行中。这会弄乱你网站的布局。如果要进行嵌套,则首先需要有一个列,然后是一个行。你可以这样解释我在这里说的。您会注意到,第二个面板会导致水平滚动。如果删除该div上的行类,滚动将消失

Responsive design 如何使响应菜单div在屏幕调整大小时滚动

我正在使用purecss制作一个响应性强的网站。在我的页面中,我有一个页眉和页脚;它们都是固定的,在它们之间我有内容,左边是垂直菜单,右边是一些内容 现在我想实现的是,当任何大小调整发生时,我的左侧菜单应该有一个滚动条,就像它自己的一样,右侧的内容也应该有一个滚动条。另外,menu div不应与页脚或页眉混合 我不是很确定,但我是否需要使用移动网络工具包来解决这个问题 我发现了一些有用的东西: 这是唯一的方法吗?或者有其他库可以帮助我吗? 基本上,我在JQuery中添加了一些函数,用于在调整大

Responsive design 地基5顶杆响应高度 我只是想根据屏幕大小来改变基础5的顶部条导航的高度。

例如,小屏幕上的顶栏高度应为100px, 在中等屏幕和更大屏幕上,高度应为150px 谢谢你的帮助! Markus将此添加到您的css中 .top-bar { height: 150px; line-height: 150px; } 移动屏幕的媒体查询 @media only screen and (max-width: 40em) { .top-bar{ height: 100px; line-height: 100px; } } 我不得不把课堂也放在媒体

Responsive design 基础和垂直对齐。更好地使用自定义媒体查询?

我即将建立我的第一个快速响应的网站,我想使用Twitter引导。我发现它们处于过渡阶段,文档不存在,所以我转到了基金会V4,香草CSS选项一。 我尝试过做一个非常简单的布局,这是一个爆炸,我真的很喜欢它 考虑到它在960GS i上工作,我的设计是这样的……只有在预编码阶段才发现(项目仍然必须被批准,但我有一些空闲时间,我已经开始编码它)这个基础没有垂直对齐系统。p> 我做了一个布局,基本上是这样的: 这就是手机上的标题(其余部分工作正常)的外观: 基本上,我遇到了三个问题: 1) Zurb如

Responsive design 制作一个三柱响应式砌体网格

这是一个自我问答 我的创意总监经常要求建造一个砖石供电的电网,但要使其响应。然后可以这样做,但是对于可变高度的图像,初始布局看起来是不完整的。解决方案是插件,但目前还不清楚将其应用于网格的最佳方式,特别是如果网格是由CMS生成的(在我的例子中是WordPress) 所以我的问题是,如何最好地制作一个3柱宽的响应式砌体网格,并且在初始荷载下看起来很好。对于3柱响应式网格,每个块周围有25px的排水沟。我认为这也有可能使排水沟响应/可变 显然,你需要在你的页面上包含Mashise和imagesLoa

上一页 1 2  3   4   5   6    7   8   9  ... 下一页 最后一页 共 14 页