複選框按鈕不能在Wordpress中工作

我需要使用CSS技術從一個站點對我的複選框進行樣式設置。問題是，風格複選框沒有在我的網站工作。然而它在下載的HTML演示上工作。複選框按鈕不能在Wordpress中工作

CSS

<style> 
input[type=checkbox].css-checkbox { 
    position:absolute; 
    z-index:-1000; 
    left:-1000px; 
    overflow: hidden; 
    clip: rect(0 0 0 0); 
    height:1px; 
    width:1px; 
    margin:-1px; 
    padding:0; 
    border:0; 
} 
input[type=checkbox].css-checkbox + label.css-label { 
    height: 28px; 
    display: inline-block; 
    line-height: 28px; 
    background-repeat: no-repeat; 
    cursor: pointer; 
} 
input[type=checkbox].css-checkbox:checked + label.css-label { 
    background-position: 0 -28px; 
} 
label.css-label { 
    background-image: url(wp-content/uploads/2017/02/cb.png); 
    -webkit-touch-callout: none; 
    -webkit-user-select: none; 
    -khtml-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none; 
    user-select: none; 
} 
</style>

功能

<?php 
function show_bank_terms() { 
    $args = array("posts_per_page" => 10, "post_type" => "fi_bank_search_terms", "order" => "DESC"); 
    $posts_array = get_posts($args); 
    echo "<div class='list-grid'>"; 
    foreach($posts_array as $post){ 
     //$search_condition = get_post_meta($post->ID, "_fi_search_condition"); 
     $search_meta = fi_get_meta($post->ID, "_fi_search_condition"); 
     //var_dump($search_meta); 
     $search_condition = ""; 
     if(count($search_meta) > 0) 
      $search_condition = $search_meta[0]['meta_id']; 
     ?> 
     <div class="search_options"> 
      <input name="<?php echo $post->post_name; ?>" type="checkbox" id="<?php echo $post->post_name; ?>" class="css-checkbox" value="<?php echo $search_condition ?>" /> 
      <label for="checkboxG1" class="css-label" style="padding-left: 40px;"><?php echo $post->post_title; ?></label> 
     </div> 
     <?php 
    } 
?>

現在從此處的CSS，如果我從input[type=checkbox].css-checkbox刪除position: absolute;話，我可以看到一個風格旁邊的實際複選框。他們是完美的工作（檢查點擊），也反映了風格複選框的檢查。但是，當我直接點擊樣式複選框時，它不起作用。什麼都沒發生。我從昨天開始就卡住了。請幫忙。

來源

2017-03-24 Shubham Jha

我認爲你的問題是標籤的for =「」不等於複選框的id =「」。你應該仔細檢查。

這裏的訣竅是標籤鏈接到複選框，從而允許我們通過單擊標籤（for/id關係）來檢查它。

來源

2017-03-24 07:49:58 Fahrenheit

完美....感謝先生救生員:) –

複選框按鈕不能在Wordpress中工作

回答

相關問題