码迷,mamicode.com
首页 > 其他好文 > 详细

如何修改没有提供对应属性的元素的样式

时间:2015-09-08 15:23:14      阅读:154      评论:0      收藏:0      [点我收藏+]

标签:

<label>
<input type="radio" name=‘group‘ class="hidden-input" />
<span class="your style about checkbox">记住我</span>
</label>
<label>
<input type="radio" name=‘group‘ class="hidden-input" />
<span class="your style about checkbox">记住我</span>
</label>
<label>
<input type="radio" name=‘group‘ class="hidden-input" />
<span class="your style about checkbox">记住我</span>
</label>
 
.hidden-input {
    opacity: 0;
    position: absolute;
    z-index: -1;
}

input[type=radio]+span {
    /* your style goes here */
    display: inline-block;
    height: 40px;
    width: 100px;
    border-radius: 4px;
    text-align:center;
    line-height:40px;
    color:rgb(255,255,255);
    background-color: rgb(26, 188, 156);
    transition-duration: 0.25s;
}

/* active style goes here */
input[type=radio]:hover+span {
    background-color: rgb(47,226,191);
}
input[type=radio]:active+span {
    color: rgb(196,231,224);
    background-color: rgb(22,160,133);
}
input[type=radio]:checked+span {
    background-color: rgb(47,226,191);
}
 

如何修改没有提供对应属性的元素的样式

标签:

原文地址:http://www.cnblogs.com/timl525/p/4791576.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!