1

图片链接：http: //i.stack.imgur.com/oh37d.jpg

我和我的团队正在使用 JSF2.0 和 JBoss7 为一个学校项目开发一个 Web 应用程序。我们被迫使用过时的 HP 触摸板来运行该应用程序，因此我们当前通过笔记本电脑的 IP 在默认的 HP webOS 浏览器上连接和查看该应用程序。一切都运行良好，直到我们开始实施 Twitter Bootstrap 来设置样式。问题是，在笔记本电脑浏览器（IE、Chrome、Firefox）上，页面看起来很棒并且没有问题，但是一旦我们在平板电脑上查看页面，每个文本框右侧都有一个数百像素的黑框阴影，并且文本区域（如图所示）。

有谁知道哪个 CSS 属性会在旧版浏览器上导致这样的事情？

提前非常感谢您的帮助！

4

1 回答 1

1

如果确实与阴影有关，您可能需要查看line 990.bootstrap.css

请注意，这可能在不同版本的 Twitter Bootstrap 之间有所不同

textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
  background-color: #ffffff;
  border: 1px solid #cccccc;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
     -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
       -o-transition: border linear 0.2s, box-shadow linear 0.2s;
          transition: border linear 0.2s, box-shadow linear 0.2s;
}

删除box-shadow声明，看看会发生什么。

作为预防措施，您可以搜索所有box-shadow出现的事件并将它们注释掉以查看它是否有所作为。

一旦你缩小了属性并修复了它，你可以使用一些 JS 魔法来只删除那个特定浏览器的阴影，但我会问一个关于这个的新问题。

于 2012-10-25T00:54:35.983 回答