无标签单选按钮式样

是否可以只用CSS来设计样式,没有标签的单选按钮? 具有标签的Radiobutton似乎看起来没问题,但没有标签的人根本没有出现。 没有通过互联网找到任何适合我的问题的解决方案。 http://codepen.io/anon/pen/iJjru/

` input.form-radio:空 {margin-left:-9999px}

input.form-radio:空〜.description {position:relative; float:left text-indent:30px margin-top:0}

input.form-radio:empty〜.description:before {position:absolute display:block top:3px bottom:0 left:0 content:''width:10px height:10px background:#fff border-radius:30px border:2px固体#fdd68d}

input.form-radio:hover:not(:checked) 〜.description.option :before {text-indent:.9em color:#C2C2C2 background-color:orange}

input.form-radio:hover:not(:checked)〜.description {color:#888}

input.form-radio:checked〜.description:before {text-indent:.9em background-color:orange}

input.form-radio:checked〜.description {color:#777}`


答案是“是”和“否”。

“是”,您可以设置像这个FIDDLE这样的单选按钮。 但他们很无聊和丑陋。

CSS

.radiotest {
    background-color: red;
    border: 2px solid green;
    width: 20px;
    height: 20px;
    margin: 20px;
}

如果你想让它们变得漂亮,答案是“否”,并在旧讨论中回答。

链接地址: http://www.djcxy.com/p/89157.html

上一篇: radiobutton styling without label

下一篇: Image to be displayed as a circled Image using css