自定义CSS不工作

-1

我使用WordPress创建自己的网站页面。我有CustomCSS插件，但它似乎并没有正确充分的工作。自定义CSS不工作

我想在我的单选按钮图片边框选择时。

我做了一个HTML/CSS操场，看看它的问题，我的CSS或WordPress和它出现了WordPress的问题。操场上展示了我想要的东西。

如何获得WordPress的这个工作，如果我有复制到我的CustomCSS插件和WordPress的HTML页面完全相同的代码？

游乐场：

.row{ 
 
    font-size: 0px; 
 
    min-height:50px; 
 
    margin-top:25px; 
 
    margin-bottom:100px; 
 
    width:100%; 
 
    margin-left:auto; 
 
    margin-right:auto; 
 
    padding:2%; 
 
} 
 

 
.third-row{ 
 
    display:inline-block; 
 
    width:25%; 
 
    margin:4%; 
 
    height:25px; 
 
} 
 

 
.input-hidden { 
 
    position: absolute; 
 
    left: -9999px; 
 
} 
 

 
.cusimg { 
 
    opacity: 1; 
 
    display: block; 
 
    width: 100%; 
 
    height: auto; 
 
    transition: .5s ease; 
 
    backface-visibility: hidden;} 
 

 
.submit-button { 
 
    padding: 50px: 200px; 
 
    position: absolute; 
 
    right: 20px; 
 
} 
 

 
.middle { 
 
    width: 50%; 
 
    height: 50%; 
 
    transition: .5s ease; 
 
    opacity: 0; 
 
    position: absolute; 
 
    text-align: center; 
 
    transform: translate(-50%, -50%); 
 
    -ms-transform: translate(-50%, -50%) 
 
} 
 

 
.third-row:hover .cusimg { 
 
    opacity: 0.3; 
 
} 
 

 
.third-row:hover .middle { 
 
    opacity: 1; 
 
} 
 

 
.text { 
 
\t opacity: 3; 
 
    font-size: 16px; 
 
    padding: 16px 32px; 
 
} 
 

 

 
input[type="radio"]:checked + label img { 
 
border: 1px solid #000; 
 
}

<div class="row"> 
 
     <div class="third-row"> 
 
      <input type="radio" name="styleid" value="2" id="2" class="input-hidden" /> 
 
      
 
     <label for="2"> 
 
     <img class="cusimg" src="https://cdn-images.gabrielny.com/is/image/GabrielCo/Medium/Gabriel-Chelsea-Platinum-Round-Straight-Engagement-Ring~ER10044PT3JJ-3.jpg" /> 
 
     </label> 
 
     </div> 
 
     <div class="third-row"> 
 
      <input type="radio" name="styleid" value="1" id="1" class="input-hidden" /> 
 
     <label for="1"> 
 
     <img class="cusimg" src="https://image.brilliantearth.com/media/shape_images/V3/BE1AS8PD08_RD75_SQ1_PE150_MQ1_white.jpg" /> 
 
     </label> 
 
     </div> 
 
     <div class="third-row"> 
 
      <input type="radio" name="styleid" value="3" id="3" class="input-hidden" /> 
 
     <label for="3"> 
 
     <img class="cusimg" src="https://ak1.ostkcdn.com/images/products/9628886/P16814617.jpg" /> 
 
     </label> 
 
     </div> 
 
    </div>

来源

2017-09-25 pkmangg

如果您解决了自己的问题，您可以将答案标记为接受的答案。没有必要添加“解决”到您的问题介绍。 –

解决自己。

它应该是“〜”来代替，大概的东西用CSS3保持兼容吗？不确定。

input.input-hidden[type="radio"]:checked ~ label img{ 
border: 1px solid #000; 
}

来源

2017-09-25 23:53:49 pkmangg

自定义CSS不工作

回答

相关问题