在html中,可以给table元素添加margin-bottom和margin-top样式设置行间距,语法“
”。
本教程操作环境:windows7系统、HTML5版、Dell G3电脑。
html中table行间距的设置方法:
1、可以通过设置table的margin-bottom属性与底部的table保持间距,margin-bottom 属性设置元素的下外边距。
代码如下:
<table style="margin-bottom:下外边间距值" >登录后复制下面通过示例看一下:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>button</title> </head> <body> <table style="border: 1px solid black;margin-bottom:100px" width="400" height="100" > <tr> <td style="border: 1px solid black" >1</td> <td style="border: 1px solid black" >2</td> <td style="border: 1px solid black" >3</td> <td style="border: 1px solid black" >4</td> </tr> <table> <table style="border: 1px solid black" width="400" height="100" > <tr> <td style="border: 1px solid black" >1</td> <td style="border: 1px solid black" >2</td> <td style="border: 1px solid black" >3</td> <td style="border: 1px solid black" >4</td> </tr> <table> </body> </html>登录后复制输出结果:
2、可以通过设置table的margin-top与上方的table保持距离,margin-top 属性设置元素的上外边距。
代码如下:
<table style="margin-top:上外边间距值" >登录后复制下面通过示例看一下:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>button</title> </head> <body> <table style="border: 1px solid black;margin-bottom:100px" width="400" height="100" > <tr> <td style="border: 1px solid black" >1</td> <td style="border: 1px solid black" >2</td> <td style="border: 1px solid black" >3</td> <td style="border: 1px solid black" >4</td> </tr> <table> <table style="border: 1px solid black;margin-top:100px" width="400" height="100" > <tr> <td style="border: 1px solid black" >1</td> <td style="border: 1px solid black" >2</td> <td style="border: 1px solid black" >3</td> <td style="border: 1px solid black" >4</td> </tr> <table> </body> </html>登录后复制输出结果:
更多编程相关知识,请访问:编程视频!!
以上是html中table行间距怎么设置的详细内容。更多信息请关注PHP中文网其他相关文章!
本站声明本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn作者最新文章
2024-09-19 06:48:14 2024-09-19 06:47:14 2024-09-19 06:46:14 2024-09-19 06:45:14 2024-09-19 06:44:14 2024-09-19 06:41:14 2024-09-19 06:38:14 2024-09-19 06:37:14 2024-09-19 06:36:14 2024-09-19 06:33:14最新问题在 PHP 中利用 VueJS 组件 我想混合由Php和VueJS组件生成的基本HTML,而不必一直使用VueJS到最低的dom叶子。父布局应用了Vue应用程序,所有标头、导航、旁注等都是Vue组件,大多数页面上的主要...来自于 2023-11-11 00:01:4402288如何在 next js 13 中使用开放图元标记? 在最近的NextJS13更新中,他们引入了一种处理元标记的新方法,该方法与传统方法不同,即创建NextHead并编写常用的html元标记。在新方法中,我们创建一个类似元数据对象的方...来自于 2023-11-10 23:03:5101527PHP邮件发送器无法正常工作:没有错误日志,消息显示已发送,但未收到 我的网络服务器的php错误日志中没有收到任何错误日志。我尝试过多个不同的SMTP服务器(我知道的其他电子邮件提供商也可以使用)。这是我的HTML表单:<formaction=...来自于 2023-11-10 15:02:3901218只选择月份和年份的v-date-picker 请告诉我是否有其他方法可以使用v-date-picker来执行此操作。我只希望用户能够选择年份和月份,然后日期选择器菜单应该关闭。这是我的html作为示例,但我不介意使用不同的代码...来自于 2023-11-10 14:05:0501269重写后的标题为:SweetAlert2: "onBeforeOpen" 参数未知 我正在使用Laravel5.8和Sweetalertv2,我尝试用它在Blade上触发此警报:Swal.fire({title:'<h4style="color:#...来自于 2023-11-10 09:39:0101257热门教程更多>
Web开发基础_HTML+CSS33750 HTML5前端面试题23435 最通俗易懂的html+css课程 9天速成40055