html table 固定宽度问题

难得121糊涂 2014-09-30 04:20:52

<table width="900" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="width:110;">aa</td>
<td style="width:110;">bb</td>
<td style="width:110;">bb</td>
<td style="width:110;">bb</td>
<td style="width:110;">bb</td>
<td style="width:110;">bb</td>
<td style="width:110;">bb</td>
<td style="width:130;">bb</td>
</tr>
</table>
这样设置table，列宽是一样的。但是如果我往某个列中插入一个input标签，列宽就不一样了。但是如果用百分比分配列宽又是一样的，这是什么原因啊，求解释

...全文

218 2 打赏收藏转发到动态举报

写回复

用AI写文章

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

哋岼線 2014-09-30

打赏
举报

把宽度加上单位px

豪情 2014-09-30

打赏
举报


<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>test</title>
    <style type="text/css">
        *{ margin:0; padding:0;}
        body{font:12px/1.125 Arial,Helvetica,sans-serif;background:#fff;}
        table{border-collapse:collapse;border-spacing:0;}
        li{list-style:none;}
        fieldset,img{border:0;}
        article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
        q:before,q:after{content:'';}
        a:focus,input,textarea{outline-style:none;}
        input[type="text"],input[type="password"],textarea{outline-style:none;-webkit-appearance:none;}
        textarea{resize:none}
        address,caption,cite,code,dfn,em,i,th,var{font-style:normal;font-weight:normal;}
        legend{color:#000;}
        abbr,acronym{border:0;font-variant:normal;}
        a{color:#0a8cd2;text-decoration:none;}
        a:hover{text-decoration:underline;}
        .clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
        .clearfix{display:inline-block;}
        .clearfix{display:block;}
        .clear{clear:both;height:0;font:0/0 Arial;visibility:hidden;}
        .none{display:none}
    </style>
</head>
<body>
<table width="900" border="1" cellspacing="0" cellpadding="0">
    <tr>
        <td style="width:110px"><input style="width:100%" type="text"/></td>
        <td style="width:110px;">bb</td>
        <td style="width:110px;">bb</td>
        <td style="width:110px;">bb</td>
        <td style="width:110px;">bb</td>
        <td style="width:110px;">bb</td>
        <td style="width:110px;">bb</td>
        <td style="width:130px;">bb</td>
    </tr>
</table>
</body>
</html>