css里<th>和<table>之间差一个宽度为2px的边框是怎么回事？

html-css037

css里<th>和<table>之间差一个宽度为2px的边框是怎么回事？,第1张

首先你要在HTML里加正确的doctype，确保IE不用quirks模式渲染，最保险加上一条meta

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="X-UA-Compatible" content="IE=edge" >

这样，然后在HTML里的table处写上 <table cellspacing="0" cellpadding="0">

CSS里reset一下

table {

border-collapse: collapse

border-spacing: 0

margin: 0

padding: 0

border: 0

}

你再看看， 应该没有多余offset了

可以使用CSS样式控制表格的高、宽 ，如：

.thWidthAndHeight{width:100px height:20px}     <table border="1" cellpadding="0" cellspacing="0">

        <caption>

            大标题

        </caption>

        <thead>

            <tr>

                <th class="thWidthAndHeight">

                    标题1

                </th>

                <th>

                    标题2

                </th>

                <th>

                    标题3

                </th>

            </tr>

        </thead>

        <tbody>

            <tr>

                <td>

                    数据1

                </td>

                <td>

                    数据2

                </td>

                <td>

                    数据3

                </td>

            </tr>

            <tr>

                <td>

                    数据1

                </td>

                <td>

                    数据2

                </td>

                <td>

                    数据3

                </td>

            </tr>

        </tbody>

    </table>

可以给每个td标签加一个class属性，名字全部一样，比如：class="tablewidth"。然后在CSS中设置这个类的宽度值即可。

也可以在,<td>里面嵌套一个<div>，然后设置div的宽度即可。