HTML_表格1

简介: 版权声明:本文为博主原创文章,转载请注明出处。 https://blog.
版权声明:本文为博主原创文章,转载请注明出处。 https://blog.csdn.net/twilight_karl/article/details/53967791

表格

结构
<table>…</table>定义表格
<tr>…</tr>定义表行
<td>…</td> 定义表列(单元格)
<th>…</th>

table属性:
width: 表格的宽度
bgcolor: 背景色
background:
border: 设置边框的宽度,默认值为0
cellpadding: 设置单元格与其内容之间的空间大小
cellspaceing:设置单元格之间的距离,默认值为2
bordercolor: 设置表格边框的颜色
align: left/right/center表格对齐

<!--表格边框、颜色-->
    <table border='2' bordercolor='blue'>
        <tr>
            <td>列1</td>
            <td>列2</td>
            <td>列3</td>

        </tr>
        <tr>            
            <td>列1</td>
            <td>列2</td>
            <td>列3</td>
        </tr>

        <tr>            
            <td>列1</td>
            <td>列2</td>
            <td>列3</td>
        </tr>

    </table>
效果图:

SouthEast

加上width=200后的效果:

SouthEast

指定cellpadding=5后的效果:

SouthEast

指定cellspacing=5后的效果:

SouthEast

加上背景后的效果:

SouthEast

相关文章
N..
|
2月前
|
前端开发 开发者
HTML表格
HTML表格
N..
11 1
|
2月前
|
移动开发 前端开发 HTML5
【基于HTML5的网页设计及应用】——实现个人简历表格和伪类选择器应用
【基于HTML5的网页设计及应用】——实现个人简历表格和伪类选择器应用
52 0
|
25天前
|
敏捷开发
【sgCreateTableColumn】自定义小工具:敏捷开发→自动化生成表格列html代码(表格列生成工具)[基于el-table-column]
【sgCreateTableColumn】自定义小工具:敏捷开发→自动化生成表格列html代码(表格列生成工具)[基于el-table-column]
|
4月前
|
前端开发 JavaScript
如何固定html表格头部,用css样式即可实现,操作简便、代码简单
如何固定html表格头部,用css样式即可实现,操作简便、代码简单
33 0
|
3天前
|
前端开发 JavaScript UED
【专栏:HTML基础篇】HTML列表与表格:展示数据的两种方式
【4月更文挑战第30天】本文探讨了HTML中的列表和表格两种元素在网页设计中的重要性。无序列表(`&lt;ul&gt;`)和有序列表(`&lt;ol&gt;`)用于呈现相关项目,前者常用于导航菜单,后者适合有序信息。表格(`&lt;table&gt;`)用于展示结构化数据,通过`&lt;tr&gt;`、`&lt;td&gt;`和`&lt;th&gt;`定义行和单元格。尽管简单,列表和表格在内容呈现和用户体验上起着关键作用。然而,响应式设计趋势下,表格可能被更灵活的布局替代,复杂数据展示则可借助JavaScript库提升交互性。正确使用这些基础元素能有效组织信息,创建优质网页。
|
8天前
|
JavaScript 前端开发 BI
原生html—摆脱ps、excel 在线绘制财务表格加水印(html绘制表格js加水印)
原生html—摆脱ps、excel 在线绘制财务表格加水印(html绘制表格js加水印)
12 1
|
15天前
|
前端开发
《HTML 简易速速上手小册》第3章:HTML 的列表与表格(2024 最新版)
《HTML 简易速速上手小册》第3章:HTML 的列表与表格(2024 最新版)
17 0
|
17天前
|
JavaScript 前端开发 数据安全/隐私保护
HTML中表单元素和表格元素分别是什么,有什么区别,列举几个代码
HTML中表单元素和表格元素分别是什么,有什么区别,列举几个代码
9 0
|
22天前
|
JSON 前端开发 JavaScript
从假数据到动态表格:一个简单的JavaScript和HTML示例
从假数据到动态表格:一个简单的JavaScript和HTML示例
|
2月前
|
移动开发 HTML5
HTML5表格简单应用案例之[招聘需求表]
HTML5表格简单应用案例之[招聘需求表]
12 0