CSS Checked + Label样式不起作用

时间:2018-05-02 01:10:55

标签: jquery html css

我有一个与单选按钮关联的标签,需要在检查时更新样式。由于某种原因,下面的代码不起作用。 感谢您的反馈。

CSS

input[type="checkbox"]:checked+label {
    border: 2px solid $primary;
    &:before {
      content: "\f00c";
      display: block;
      background: $primary;
      padding: 10px;
      color: #fff;
      position: absolute;
      top: 0;
      right: 0;
      font: normal normal normal 14px/1 FontAwesome;
    }
  }

HTML

<div class="grid__item one-third small--one-half">
    <input type="radio" name="Hamper option" class="hide hamper-option" value="3782230835231" id="3782230835231" data-name="Robert Mondavi Napa Valley Pinot Noir Carneros 2012" data-price="19900" data-image="image-robert-mondavi-napa-valley-pinot-noir-carneros-2012" checked="checked">
    <label class="product-select" for="3782230835231">
        <div class="image">
            <img src="//cdn.shopify.com/s/files/1/249df4/0ff534/products/71dfTfTyxzEqL._SY500_small.jpg?v=1510096df324" alt="Default Title">
        </div>
        <div class="product-info">
            <small>A Wine Bottle</small>
            Robert Mondavi Napa Valley Pinot Noir Carneros 2012<br>
            $199.00
        </div> 
    </label>
</div>

0 个答案:

没有答案