纯CSS让radio实现点击显示隐藏效果

<style>
#faq input[type=‘radio‘]{
　　display: none;
}
#r1:checked~dd{
　　display: block;
}
#r2:checked~dd{
　　display: block;
}
#r3:checked~dd{
　　display: block;
}
</style>

　　　　　　　　　　<section style="padding: 20px;">
                    <div>
                        <p><b>全局参数配置</b></p>
                        <br />
                        <hr />
                        <br />
                    </div>
                    
                    <div>
                        <div class="r">
                            <input type="button" id="" value="添加全局参数" class="btn_blue" style="padding: 14px 34px;font-size: 18px;"/>
                        </div>
                        <ul id="faq">
                            <li>
                                <dl class="padding_tb20">
                                    <label for="r1" class="gac_dt1">价格计算配置</label>
                                    <input type="radio" name="r1" id="r1">
                                    <dd class="gac_dd1">
                                        <table border="0" cellspacing="0" cellpadding="0" class="textAlign_center" width="100%" style="table-layout:fixed;">
                                            <tr>
                                                <td>类型</td>
                                                <td>创建时间</td>
                                                <td>修改时间</td>
                                                <td>唯一标志</td>
                                                <td>参数内容</td>
                                                <td>参数备注</td>
                                                <td>操作</td>
                                            </tr>
                                            <tr>
                                                <td>文本</td>
                                                <td>2015-10-14 11:09:10</td>
                                                <td>2015-10-14 11:09:10</td>
                                                <td>cur_usa_cn</td>
                                                <td>6.5</td>
                                                <td class="overflow_Hidden">
                                                    美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换xdx.人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率
                                                </td>
                                                <td>
                                                    <input type="button" class="gac_btn1" style="background-color: #F90;" value="修改" >&nbsp;&nbsp;<input type="button" class="gac_btn1" style="background-color: #F30;" value="删除" >
                                                </td>
                                            </tr>
                                        </table>
                                    </dd>
                                </dl>
                            </li>
                            <br /><br />
                            <li>
                                <dl class="padding_tb20">
                                    <label for="r2" class="gac_dt1">价格计算配置</label>
                                    <input type="radio" name="r1" id="r2">
                                    <dd class="gac_dd1">
                                        <table border="0" cellspacing="0" cellpadding="0" class="textAlign_center" width="100%" style="table-layout:fixed;">
                                            <tr>
                                                <td>类型</td>
                                                <td>创建时间</td>
                                                <td>修改时间</td>
                                                <td>唯一标志</td>
                                                <td>参数内容</td>
                                                <td>参数备注</td>
                                                <td>操作</td>
                                            </tr>
                                            <tr>
                                                <td>文本</td>
                                                <td>2015-10-14 11:09:10</td>
                                                <td>2015-10-14 11:09:10</td>
                                                <td>cur_usa_cn</td>
                                                <td>6.5</td>
                                                <td class="overflow_Hidden">
                                                    美元兑换人民币
                                                </td>
                                                <td>
                                                    <input type="button" class="gac_btn1" style="background-color: #F90;" value="修改" >&nbsp;&nbsp;<input type="button" class="gac_btn1" style="background-color: #F30;" value="删除" >
                                                </td>
                                            </tr>
                                        </table>
                                    </dd>
                                </dl>
                            </li>
                            <br /><br />
                            <li>
                                <dl class="padding_tb20">
                                    <label for="r3" class="gac_dt1">价格计算配置</label>
                                    <input type="radio" name="r1" id="r3">
                                    <dd class="gac_dd1">
                                        <table border="0" cellspacing="0" cellpadding="0" class="textAlign_center" width="100%" style="table-layout:fixed;">
                                            <tr>
                                                <td>类型</td>
                                                <td>创建时间</td>
                                                <td>修改时间</td>
                                                <td>唯一标志</td>
                                                <td>参数内容</td>
                                                <td>参数备注</td>
                                                <td>操作</td>
                                            </tr>
                                            <tr>
                                                <td>文本</td>
                                                <td>2015-10-14 11:09:10</td>
                                                <td>2015-10-14 11:09:10</td>
                                                <td>cur_usa_cn</td>
                                                <td>6.5</td>
                                                <td class="overflow_Hidden">
                                                    美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换人民币的汇率美元兑换xd兑换人
                                                </td>
                                                <td>
                                                    <input type="button" class="gac_btn1" style="background-color: #F90;" value="修改" >&nbsp;&nbsp;<input type="button" class="gac_btn1" style="background-color: #F30;" value="删除" >
                                                </td>
                                            </tr>
                                        </table>
                                    </dd>
                                </dl>
                            </li>
                            <br /><br />
                            
                        </ul>
                        
                    </div>
                </section>

　　.textAlign_center{
　　　　text-align: center;
　　}

　　.padding_tb20{
　　　　padding: 20px 0;
　　}

　.btn_blue{
     padding: 12px 30px; 
     background-color: #4C9FFF; 
   　color: #fff; 
     border-radius: 6px;
  　 font-weight: bold;
  　 font-size: 14px;
　}
　.gac_dt1{

　　　　padding: 18px 140px;
　　　　color: #4C9FFF;
　　　　cursor:pointer;
　　　　font-weight: bold;
　　　　font-size: 20px;
　　　　border: 1px solid #4C9FFF;
　　　　display:inline;
　　　　border-radius: 6px;
　　}

　　.gac_dd1{
　　　　margin: 30px 0 0;
　　　　display: none;
　　}
　　.gac_btn1{
　　　　color: #FFF;
　　　　padding: 10px 26px;
　　　　border-radius: 6px;
　　　　font-weight: bold;
　　}

　　.overflow_Hidden{
　　　　overflow:hidden;
　　　　text-overflow:ellipsis;
　　　　word-break:keep-all;
　　　　white-space:nowrap;
　　}