怎么将input设置和td一样大且不改变样式

如何将input设置和td一样大且不改变样式
撸主最近要设计word表格形式的页面,发现input很难和td框契合
这是撸主的代码

<table id="list_tab" width="800" height="630" align="center" style="width:100%;border:0;border-collapse:collapse;cellspacing:0;cellpadding:0">
        <tr>
            <td width="133">单位全称</td>
            <td colspan="2"><input type="text"/></td>
            <td width="133">电子邮箱</td>
            <td colspan="2"><input type="text" /></td>
        </tr>
        <tr>
            <td>现实际经营地址</td>
            <td colspan="3"><input type="text"/></td>
            <td width="133">邮政编码</td>
            <td width="156"><input type="text"/></td>
        </tr>
        <tr>
            <td height="51">上级主管单位(部门)</td>
            <td colspan="2"><input type="text"/></td>
            <td>单位状态</td>
            <td colspan="2">
                <div style="text-align: left;float: left;padding-left: 30px;">
                    <input type="radio" name="UnitStats" value="" />正常<br/>
                    <input type="radio" name="UnitStats" value=""  />吊销、注销<br/>
                    <input type="radio" name="UnitStats" value=""  />破产、关闭、解散
                </div>
                <div style="text-align: left;float: left;padding-left: 30px;">
                        <input type="radio" name="UnitStats" value=""  />无证照<br/>
                        <input type="radio" name="UnitStats" value=""  />其他
                </div>
            </td>
        </tr>
        <tr> 
 
            <td>注册登记机关</td>
            <td width="112"><input type="text"/></td>
            <td width="109">成立日期</td>
            <td><input type="text"/></td>
            <td>注册号</td>
            <td><input type="text"/></td>
        </tr>
        <tr>
            <td>注册地址</td>
            <td colspan="3"><input type="text"/></td>
            <td>注册资金(万元)</td>
            <td><input type="text"/></td>
        </tr>
        <tr>
            <td>营业执照变更前名称</td>
            <td colspan="2"><input type="text"/></td>
            <td>营业执照变更前地址</td>
            <td><input type="text"/></td>
            <td><input type="text"/></td>
        </tr>
        <tr>
            <td>组织机构代码证号</td>
            <td colspan="3"><input type="text"/></td>
            <td>社保登记号</td>
            <td><input type="text"/></td>
        </tr>
        <tr>
            <td>法定代表人(或负责人)</td>
            <td><input type="text"/></td>
            <td>办公电话</td>
            <td><input type="text"/></td>
            <td>身份证号码</td>
            <td><input type="text"/></td>
        </tr>
        <tr>
            <td>人力资源负责人</td>
            <td><input type="text"/></td>
            <td>办公电话</td>
            <td><input type="text"/></td> 
 
            <td>移动电话</td>
            <td><input type="text"/></td>
        </tr>
        <tr>
            <td>人力资源经办人</td>
            <td><input type="text"/></td>
            <td>办公电话及传真电话</td>
            <td><input type="text"/></td>
            <td>移动电话</td>
            <td><input type="text"/></td>
        </tr>
    </table>

.css:

* {
font-family: "宋体";
font-size: 12px;
text-decoration: none;
margin: 0px;
padding: 0px;
}
#list_tab th{
    text-align: center;
    border: 1px solid #E0E4EB;
}
#list_tab td{
    text-align: center;
    border: 1px solid #E0E4EB;
}
#list_tab input{
    border:0;
    background:transparent;
}

input输入框不能填满整个表格,如果将input的样式设成height:100%;width:100%;单选框会变形.求解决办法! HTML CSS
[解决办法]
    <table width="50%" cellpadding="0" cellspacing="0">
    <tr >
    <th>one</th>
    <th>two</th>
    <th>three</th>
    <th>four</th>
    </tr>
    <tr>
    <td><input type="text"/></td>
    <td><input type="text"/></td>
    <td><input type="text"/></td>
    <td><input type="text"/></td>
    </tr>
    </table>

<style type="text/css">
table,th,td{
border:1px solid #328AA4;
}
td input{
border:none;
width:100%;
}
</style>
[解决办法]
二楼的做法真的不错，已测试，非常好的效果，顶一个！

查看更多 下一篇