html中怎样设置一个table的一个格子th的长宽

html中怎样设置一个table的一个格子th的长宽,第1张

可以使用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>

1、新建一个html文件,命名为test.html。

2、在test.html文件内,使用table标签创建一个表格,并使用border属性设置表格的边框为1px。

3、在test.html文件内,使用tr、td两个标签创建表格为两行两列,代码如下。

4、在test.html文件内,编写<style type="text/css"></style>标签,页面的css样式将写在该标签内。

5、在css标签中,对table的td元素进行样式设置,使用padding属性设置单元格的间距为10px,即单元格的内边距为10px。

6、除了上面的方法外,还可以使用cellpadding属性直接在table标签内设置,实现单元格的间距定义。

<th>表格内容</th>

1,常放置表格的首行或者首列,用以自动加粗先是表格内容

2,使用<th>标签显示的表格内容常默认为在表格单元中居中显示

3,前两点都避免了:如果使用<td>想达到同样效果,还要使用align属性和字体加粗<b>


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11689742.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-18
下一篇 2023-05-18

发表评论

登录后才能评论

评论列表(0条)

保存