2

Three.jsのWebGLレンダラーを使用すると、ラジオボタンの背景が白になります。Chromeでのみ発生するようです。

これが問題を示すフィドルです：http：//jsfiddle.net/5pL8v/328/

何かありますか、できればCSSがあれば、これを修正しますか？

コード例：

<style>
body {
    background: black;
}
</style>

<script>
renderer = new THREE.WebGLRenderer();
$(document).ready(function() {
    $("body").append(renderer.domElement);
});
</script>

<input type="radio">
4

1 に答える 1

2

I was not able to see the problem OSX / Chrome beta. However, it is probably related to the rendering of widgets in native style by default and your operating system version. You can disable this in WebKit browsers using -webkit-appearance: none.

Example how to replace radio button with a green square:

body {
    background: black;
    color: white;
}

input[type=radio] {
    background: green;
    color: yellow;
    -webkit-appearance: none;
    width: 10px;
    height: 10px;
}

input[type=radio]:checked {
    background: red;
}

I suggest you style radio buttons in platform-neutral way if they break on you. Here is one tutorial: http://www.wufoo.com/2011/06/13/custom-radio-buttons-and-checkboxes/

于 2012-12-12T03:11:09.290 に答える