0

我有几个像常规按钮一样显示的单选按钮,它们看起来像这样:

            <div class="buttoncontainer" style="position:relative; left: 80px;">
                <label><input type="radio" name="toggle" checked="checked" class="_today">          <span class="css3button-left">Today</span></label>
                <label><input type="radio" name="toggle" class="_tomorrow"><span class="css3button">Tomorrow</span></label>
                <label><input type="radio" name="toggle" class="_weekend"><span class="css3button">This Weekend</span></label>
                <label><input type="radio" name="toggle" class="_nextmonth"><span class="css3button-right">Next Month</span></label>
            </div>

像这样选择时,我会更改按钮的外观:

     .buttoncontainer  input:checked + span
     { 
        ...
     }

这适用于我测试过的所有浏览器——IE、FireFox、Chrome,甚至是我电脑上的 Safari,但外观永远不会改变为 :checked on the Ipad or Iphone using Safari 。有谁知道为什么这些按钮只在 ipad 上不起作用?

4

1 回答 1

0

我想你的意思是标签不可点击?

由于某些原因,该label元素的通常行为不适用于开箱即用的移动 WebKit。

添加label { cursor: pointer; }到 CSS 解决了这个问题。

于 2012-08-06T16:59:56.847 回答