CSS - 圆角选择、复选框和单选按钮
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/738836/
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
CSS - Rounded Select, Checkbox and Radiobutton
提问by Jakub Arnold
Is there any way, how to make rounded HTML <select>, without using any javascript?
I have this insane design and I have absolutely no idea how to do it only with CSS.
有什么办法，如何在<select>不使用任何 javascript 的情况下制作圆形 HTML ？我有这个疯狂的设计，我完全不知道如何只使用CSS来做到这一点。
The same problem is with checkboxand radiobutton. Does anybody know how to make them rounded?
checkbox和也有同样的问题radiobutton。有人知道如何使它们变圆吗？
I need solution that works for IE6+, Firefox 2+, Opera 9+ ...
我需要适用于 IE6+、Firefox 2+、Opera 9+ 的解决方案......
采纳答案by DisgruntledGoat
No. Form styling is very problematic, there are no guarantees that any styling will work. Simple borders and background colours/images generally work OK in most browsers. I believe Safari will let you style very little. Check this pagefor more detailed info.
不。表单样式非常有问题，不能保证任何样式都有效。简单的边框和背景颜色/图像在大多数浏览器中通常都可以正常工作。我相信 Safari 会让你的风格很少。查看此页面以获取更多详细信息。
Honestly, the best solution is to use javascript. jQuery click menuis a great solution I used recently to mimic a select box (used JS to set a value on a hidden field when an element in the menu was selected).
老实说，最好的解决方案是使用 javascript。jQuery click menuis a great solution I used recently to mimic a select box (used JS to set a value on a hidden field when an element in the menu was selected).
I'm sure there are other solutions around too if you search.
如果您进行搜索，我相信周围也有其他解决方案。
回答by Phil.Wheeler
No.
不。
Now the long answer: Internet Explorer does not lend itself well to being styled. You will be able to set a background image for the left-hand side (the text content) that has rounded corners, but the drop-down arrow will be fixed as the default browser. You'll also find that the mousedown and mouseover states for the control will be fixed as the default style.
现在是长答案：Internet Explorer 不适合设计样式。您将能够为具有圆角的左侧（文本内容）设置背景图像，但下拉箭头将固定为默认浏览器。您还会发现控件的 mousedown 和 mouseover 状态将固定为默认样式。
I think that in many cases, the ideal preferred design needs to be a little pragmatic about limitations in browser standards support. Specifically, the problem that IE6 doesn't support a fair number and IE7 is only slightly more compliant.
我认为在许多情况下，理想的首选设计需要对浏览器标准支持的限制保持一点务实。具体来说，IE6 不支持公平数字和 IE7 只是稍微更合规的问题。
Sorry for the bad news.
关于这些坏消息我很遗憾。
回答by mina
no please see this site for radiobutton and checkbox http://www.maratz.com/blog/archives/2006/06/11/fancy-checkboxes-and-radio-buttons/
不，请查看此站点以获取单选按钮和复选框 http://www.maratz.com/blog/archives/2006/06/11/fancy-checkboxes-and-radio-buttons/
回答by Ramesh Joshi
No, Whit out javascript or jQuery you can not do this. But if you need with jQuery try this link. It contains the HTML select box with rounded corners by jQuery.
不，没有 javascript 或 jQuery 你不能这样做。但是，如果您需要使用 jQuery，请尝试此链接。它包含 jQuery 圆角的 HTML 选择框。
http://webworld-develop.blogspot.com/2011/11/cool-html-5-select-with-jquery-and-css.html
http://webworld-develop.blogspot.com/2011/11/cool-html-5-select-with-jquery-and-css.html
