Articles of css

Android OS键盘移动网站内容?

我有一个移动网站,有4个元素绝对位于100%高度div内,当我点击url栏时,div上的高度缩小并推动所有内容。 反正有没有解决这个问题? 或者防止它改变100%? 或者我需要使用JS获取屏幕大小并以这种方式修复它? 如果我将它设置为确切的数量,它工作正常。

修复Android中的绝对定位

我有我的网站,它看起来很棒,但我不是Android的专业编码器。 我不知道它有多余的怪癖,我不确定锄头我真的需要知道。 有没有办法像IE中的条件评论那样单独输出? 这是我的网站 ,横幅和徽标显示在屏幕的左侧。 我有一个三星Galaxy 3,这就是我的横幅看起来像。 现在我意识到为什么会发生这种情况,这是因为它们都是绝对定位的,显然margin-left的margin-left使得它离开了屏幕。 但是,如果不破坏所有常规桌面浏览器的布局,我无法改变它。 #site-title { background: url(img/heavensgate-logo.jpg) no-repeat; width: 229px;height: 297px; position: absolute; top: 0px; left: 50%; margin-left: -438px; z-index: 2; border: 0px; text-indent: -9999px; } #banner { position: absolute; top: 165px; width:868px; left: 50%; margin-left: -448px; z-index: 1; padding: 15px; background-color: #fff; border: 1px solid #b4b4b4; } Heavens […]

什么会导致元素在Android浏览器中不跨越全宽

我被要求看一个奇怪的问题,不能弄明白。 基本上 元素通常会跨越整个宽度,因为它们是块元素,但在某些页面上它们似乎并不想要。 我已经在默认的ICS Android和Dolphin上进行了测试,它正在两者上播放。 这个问题总结了这个问题,只有答案不起作用: 为什么Android浏览器不会在整个浏览器宽度上跨越这一段? 更新:一个奇怪的解决方案? 如果我设置以下CSS p {background:#fff; 它解决了问题,可能会导致一些奇怪的问题。 问题是,我需要背景是透明的。

当软键盘出现在phonegap中时隐藏输入字段

使用适用于Android和iOS的Phonegap 3.6.3创建移动应用程序。 这个问题仅适用于Android,因为iOS会按照我的意愿行事。 当我单击输入文本字段或textarea时,会出现一个软键盘。 它有时会涵盖这些元素。 这些页面放在iScroll中,位于底部,另一个是绝对放置的div,因此一旦屏幕popup,我就无法滚动到其中任何一个。 我怀疑当键盘出现时我必须将webview更改为更小。 然而,在尝试了很多东西后,它无法正常工作。 config.xml中 (已经为android-windowSoftInputMode尝试了许多不同的值,如下例所示) 网页负责人 (是的,我也尝试了很多其他的事情) 您可能认为相关的任何其他内容,请告诉我。 不幸的是,我不能自由地分享太多的代码,但根据我的理解,我们需要担心的是。 谢谢,

Android WebView和CSS媒体查询

我有一个基本的网页,当在Android平板电脑(Nexus 7)上的Chrome中显示时,它可以正确响应屏幕尺寸和方向变化(使用CSS媒体查询)。 当我在WebView中显示相同的页面时,基于屏幕宽度的媒体查询不起作用。 这是我如何设置WebView: WebView webView = (WebView) findViewById(R.id.webView); webView.getSettings().setJavaScriptEnabled(true); webView.getSettings().setLoadWithOverviewMode(true); webView.getSettings().setUseWideViewPort(true); webView.loadUrl(“http://10.0.1.8:8080/cbc/test”); WebView根据以下媒体查询的行为正确检测方向更改: @media only screen and (orientation: portrait) { .landscape { display: none; } } @media only screen and (orientation: landscape) { .portrait { display: none; } } 使用屏幕尺寸的媒体查询无法正常工作,因为根据以下JavaScript,屏幕宽度和高度通过方向更改保持不变: $(“#dimensions”).empty(); $(“#dimensions”).append($(“Width: ” + screen.width + “”)); $(“#dimensions”).append($(“Height: ” + screen.height + “”)); $(“#dimensions”).append($(“Depth: […]

Fancybox:无法在Android手机上滚动

我正在使用Fancybox在我的网站上输出计算器的结果: inlandprotitle.com 桌面和iphone上的输出效果很好: -webkit-overflow-scrolling: touch; 在Android手机上裁剪输出。 有没有办法在Android手机上启用fancybox滚动?

Android设备上的Times New Roman

对于我的客户,我正在使用Times New Roman字体构建一个网站。 除Android设备(移动设备,平板电脑)外,一切似乎都运行良好。 Android没有Times New Roman字体。 据我所知,你只能使用Droid Serif字体,它的外观与Times不同。 除此之外,font-size也有所不同,并导致很多对齐问题。 有没有办法使用Times New Roman for Android? 我知道fontface,但没有任何免费的webfont可用于Times New Roman。 也许它有一个(可接受的)等价物? 提前致谢!

Android Chrome浏览器覆盖了覆盖输入字段的网页上的软键盘

我在HTML5应用程序上遇到此问题。 它适用于iOS上的Safari和Chrome,但问题出现在Android设备上。 每当显示带有输入字段的表单并尝试输入任何详细信息时,软键盘将覆盖字段,而不是将其向上移动。 在像手机这样的小型设备上,无法看到您输入的内容。 我需要补充一点,在全屏模式下运行添加到主屏幕的应用时,情况会更糟。 键盘只是覆盖了一切。 我已经在网上尝试过每一个“解决方案”,但无济于事。 请注意,这不适用于原生应用,而是适用于在线网站。 提前致谢。

简单的HTML选择不在Android chrome上工作

我在使用google chrome for android时遇到了麻烦。 我在html中的选择标记在那里不起作用,但它适用于桌面谷歌浏览器和其他浏览器,甚至在safari和苹果移动设备上,只是不在谷歌浏览器的Android。 我尝试过其他具有正常选择function的应用,但它们似乎适用于移动谷歌浏览器。 以下是一个正在发生的事情的例子: Gif Image 我不知道如何解决这个问题,如果有人能给我提示可能是什么原因。 这是选择: AMEX DINE DSVR MCRD VISA

@ font-face无法在Android浏览器中使用

除了适用于Android Browser和Firefox for Android (来自http://oftn.org/css/global.css )之外,以下@font-face声明适用于所有主流浏览器(including Chrome for Android) ): @font-face { font-family: “OFTN Aller”; src: url(“../fonts/OFTN-Aller-Bold.woff”) format(“woff”), url(“../fonts/OFTN-Aller-Bold.ttf”) format(“truetype”); font-weight: bold; font-style: normal; } @font-face { font-family: “OFTN Aller”; src: url(“../fonts/OFTN-Aller.woff”) format(“woff”), url(“../fonts/OFTN-Aller.ttf”) format(“truetype”); font-weight: normal; font-style: normal; } 我能做错什么? 截图 Android 4.0.3浏览器: Windows 7上的Chrome 19: Windows 7上的Firefox 13: