Bootstrap中纵向和横向的不同网格布局

2024-02-05

我正在使用 Sencha 制作 Android 应用程序。 我正在使用此布局在手机和平​​板电脑中进行响应式布局

<div class="row">
  <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-4</div>
  <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-4</div>

  <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-4</div>
  <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-4</div>
</div>

现在我还想在从纵向模式切换到横向模式时指定不同的网格布局。例如,在移动屏幕中,我想在纵向模式下使用 col-xs-6 ,在横向模式下使用 col-xs-3 。那么我该怎么做呢?


我之前在网络应用程序中使用过它,但我没有让它与 Cordova/PhoneGap 一起使用,所以你必须使用 Sencha 来测试它。

@media screen and (min-aspect-ratio: 13/9){ } // landscape and 
@media screen and (max-aspect-ratio: 13/9){ } // portrait.

不得不挖掘我在哪里找到它,但这是原始来源:http://abouthalf.com/development/orientation-media-query-challenges-in-android-browsers/ http://abouthalf.com/development/orientation-media-query-challenges-in-android-browsers/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Bootstrap中纵向和横向的不同网格布局 的相关文章

  • 该项目可能使用的 Gradle 版本不包含“compileSdkVersion()”方法

    当我尝试运行最初在 Eclipse ADT 上创建的项目时 我遇到了这个问题 Error 17 0 Gradle DSL method not found compileSdkVersion Possible causes ul li Th
  • 如何使用 Spring Boot 传输音频

    我想让用户能够播放声音 我的实现在 Firefox 上运行良好 在 Safari 上 不播放声音 我验证了音频控制可以在 Safari 中与其他网站一起使用 所以 我认为我必须更改控制器中的某些内容 控制器 RequestMapping v
  • Android:如果任务管理器终止,则重新调用应用程序

    如果应用程序线程被任务管理器杀死 则应用程序线程将关闭 需要重新调用应用程序 就像它被其他应用程序或任务管理器杀死一样 任何想法 您必须使用 START STICKY 命令运行后台服务 只需扩展 Service 并重写 onCommand
  • 从 Android 访问云存储

    我一直无法找到任何有关如何从 Android 应用程序使用云存储的具体文档 我确实遇到过这个客户端库 https cloud google com storage docs reference libraries然而 Google Clou
  • phonegap html5 android 同步文件系统 IO

    如何使用 PhoneGaps 文件系统 API 同步读写文件 有可用的同步包装器吗 无法通过提供的 api 同步访问文件 从phonegap的实现方式猜测 我怀疑您是否可以编写一个插件来同步执行此操作
  • @fontface - 禅宗购物车中的 403 禁止错误

    我不确定这是否是发布此内容的正确位置 因为我不知道问题出在哪里 基本上 字体现在对我来说真的很痛苦 而且没有任何效果 我尝试从 google fonts 加载字体 但遇到了 IE 问题 所以我决定下载它们并自己提供服务 但现在它无法在任何浏
  • django 模板上的 vscode html 自动套用格式

    我喜欢 VSCode 的保存自动格式功能 直到它弄乱了我的模板代码 它错误地将我的 django 模板语法格式化为一行代码 有时非常长的一行 所以不用这段代码 for row in ABCDEFGH tr for col in 123456
  • 将触摸事件从 NestedScrollView 传递到父视图

    我在 NestedScrollView 下方有一个 ViewPager 宽度一些顶部填充 以及 ClipToPadding false 和透明背景 如图像 我的 ViewPager 无法获取触摸事件并且无法工作 我怎么解决这个问题 我无法更
  • Android OptionsMenu问题,背景始终透明

    我的选项菜单总是不显示背景 背景是透明的 有谁知道如何摆脱这个 我的失败起源活动是从另一个自定义活动扩展的 我在 eclipse 上有这个项目 选项菜单工作正常 但自从我迁移到 AndroidStudio 后 选项菜单始终是透明的 我尝试更
  • 如何为 flutter 绘图应用实现橡皮擦功能

    有一个关于通过 flutter 创建绘图应用程序的视频 YouTube https www youtube com watch v yyHhloFMNNA 它支持当用户点击屏幕时绘制线 点 但我找不到像 Android 本机那样擦除用户绘制
  • 带有覆盖CSS的背景图像

    我如何在 CSS 中设计带有叠加层的背景图像 就像这个示例图像一样 这是代码 我想添加tour类到背景图像和叠加效果 div class tour div class container div class row div class co
  • iPhone 上的锁定方向 UIWebView

    有没有办法锁定 UIWebView 的方向 使用 Obj C JS 还是 Html 我不想有按钮或任何东西 我只想在应用程序打开时将其锁定为纵向 好像这个堆栈溢出帖子 https stackoverflow com questions 43
  • 在循环中按名称访问变量

    我正在开发一个 Android 项目 并且有很多可绘制对象 这些绘图的名称都类似于icon 0 png icon 1 png icon 100 png 我想将这些可绘制对象的所有资源 ID 添加到整数 ArrayList 中 对于那些不了解
  • 如何在 HTML 中将文本设置为粗体?

    我正在尝试使用 HTML 将一些文本加粗 但我很难让它发挥作用 这就是我正在尝试的 Some
  • Android项目中使用java获取电脑的IP地址

    我在用ksoap2 android http code google com p ksoap2 android 我需要使用java获取IP地址 这样我就不必每次都手动输入它 我所说的 IP 地址是指 例如 如果我这样做ipconfig使用命
  • 如果我的应用程序安装在 SD 卡上,私人数据也在那里吗?

    我假设应用程序的私有数据 例如 SharedPreferences 和 SQLite 数据库 位于手机的内部存储而不是 SD 卡上 即使应用程序本身安装在 SD 卡上 我在任何地方都找不到对此的简单明确的确认 有人可以确认一下吗 是的 私有
  • Android Jetpack Compose 尺寸随持续时间变化的动画

    如何在 Jetpack Compose 中添加内容大小更改动画的持续时间 尝试使用Modifier animateContentSize 并通过动画规格具有持续时间 但它只是突然进入或退出 没有观察到持续时间 Column Modifier
  • 按“重置应用程序首选项”后,我的应用程序的所有权限都被撤销

    我开发了一个应用程序 支持Android 6 0 当我在 设置 gt 应用程序 gt 重置应用程序首选项 中重置应用程序首选项时 我的应用程序的所有权限都将被撤销 并且应用程序不会重新启动 撤销权限后未能重新启动应用程序可能会导致许多意外崩
  • Android Volley - 发布请求 - 无法在线工作

    我试图通过 Volley 发出 POST 请求 它在我的本地主机中工作得很好 但是当我将它移动到网络服务器时 响应为空 Java代码 RequestQueue queue Volley newRequestQueue this String
  • 在 Qt 中构建 Android 项目不再有效

    所以我对 Android SDK NDK 和 Apache Ant 进行了一些更新 现在我无法构建任何 Android 项目 我收到一条警告 然后它说找不到 build xml 文件 错误 Warning Android platform

随机推荐