CSS 构建仍使用 iOS 功能的样式选择列表

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8139302/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-30 02:10:13  来源:igfitidea点击:

Building a styled select list that still uses iOS functionality

cssiosmobile-safari

提问by Jared

It's pretty easy to style a text input and have it work right in iOS. By right I mean the onscreen keyboard will still open up as expected and the Previous|Next buttons still let you tab between inputs.

为文本输入设置样式并使其在 iOS 中正常工作非常容易。我的意思是,屏幕键盘仍会按预期打开,上一个|下一个按钮仍可让您在输入之间切换。

Most prettified select lists out there seem to replace an actual ... with other elements to get a nice look. This works in iOS but if you are Previous|Nexting through a bunch of inputs it won't act as expected.

大多数美化的选择列表似乎用其他元素替换了实际的 ... 以获得漂亮的外观。这在 iOS 中有效,但如果您是 Previous|Nexting 一堆输入,它将不会按预期运行。

Is it possible to style a select list so that it will work like a plain but look like something you'd get from Dropkick JS or another library (or build yourself)? I considered trying to hide a real select behind an element but I don't think I can make the list open up correctly with javascript.

是否可以设置选择列表的样式,使其像普通的一样工作,但看起来像您从 Dropkick JS 或其他库(或自己构建)中获得的东西?我考虑过尝试在元素后面隐藏真正的选择,但我认为我无法使用 javascript 正确打开列表。

回答by albert

You can alter practically any of the formcontrols in iOS. Here's a great demo: http://37signals.com/svn/posts/2609-customizing-web-forms-with-css3-and-webkit
I'm a big fan of the formalize library, which is going to apply styles you may not like, but you can always change them; it's a great library to learn from: http://formalize.me

您几乎可以更改formiOS 中的任何控件。这是一个很棒的演示:http: //37signals.com/svn/posts/2609-customizing-web-forms-with-css3-and-webkit
我是formalize 库的忠实粉丝,它将应用您的样式可能不喜欢,但你可以随时改变它们;这是一个很棒的图书馆,可以学习:http: //formalize.me