html - 我是否希望在选中“特定”单选按钮时显示隐藏的表单元素？

我似乎找不到这样做的方法，我可以让它的工作接近单选按钮，但不是一个具体的。
这是我的代码，几乎可以满足我的需要：

...
Are you a supplier?:<br />
<input type="radio" name="supplier" id="supplier_no" value="0"/> No<br>
<div>
<input type="radio" name="supplier" id="supplier_yes" value="1"/> Yes
<br /><br />
<div class="languagereveal1">
What Language do you work with?:<br />
<select name="language1" value="">
...

以及支持它的CSS：

.languagereveal1 {
opacity: 0;
max-height: 0;
overflow: hidden;
}

input[type="radio"]:checked ~ .languagereveal1 {
opacity: 1;
max-height: 100px;
overflow: visible;
}

我想要的是“是”单选按钮在“否”单选按钮之前。
我想一定有办法在CSS的“input[type=”radio“]位中指定使用ID，我试过使用我知道但似乎不正确的东西，我四处查看但什么也找不到。
任何帮助都将不胜感激，谢谢。

最佳答案

如果要在“否”之前移动“是”按钮，则使用HTML结构选择器将：

#supplier_yes:checked ~ div > .languagereveal1 {
    opacity: 1;
    max-height: 100px;
    overflow: visible;
}

或者input[type="radio"]:checked ~ div > .languagereveal1也会起作用。
演示：http://jsfiddle.net/v3p2fju7/