table_border.html

最新推荐文章于 2022-10-13 10:07:05 发布
最新推荐文章于 2022-10-13 10:07:05 发布
阅读量73 收藏
点赞数
分类专栏： JavaScript 文章标签： HTML CSS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/cnsd007/article/details/83815338
版权 
<html>
	<head>
		<title>表格边框的隐藏</title>
		<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
		<style type="text/css">
body {
	
	font-family: "宋体";
	font-size: 12px;
	margin-top: 4;
}

.t {
	border: #3399ff;
	border-style: solid;
	border-width: 1px;
	BORDER-COLLAPSE: collapse
}

td {
	font-family: "Tahoma", "MS Shell Dlg";
	font-size: 12px
}

textarea {
	border: 1 solid 
}
</style>
	</head>

	<body  >
		<center>
			<table width="600" border="0" cellspacing="0" cellpadding="0"
				height="30">
				<tr>
					<td>
						<b>表格边框的隐藏</b>
					</td>
				</tr>
			</table>
			<table width="600" border="0" cellspacing="0" cellpadding="8"
				class="t">
				<tr>
					<td>
						<table style="BORDER-COLLAPSE: collapse" borderColor="#3399ff" border="1" width="200" cellpadding="0" cellspacing="0">
							<tr align="center">
								<td>
									普
								</td>
								<td>
									表
								</td>
							</tr>
							<tr align="center">
								<td>
									通
								</td>
								<td>
									格
								</td>
							</tr>
						</table>
					</td>
					<td>
						这是一普通的表格
					</td>
				</tr>
				<tr>
					<td>
						<br>
						<table style="BORDER-COLLAPSE: collapse" borderColor="#3399ff" width="200" border="1" cellspacing="0" cellpadding="0"
							frame=above>
							<tr align="center">
								<td>
									头
								</td>
								<td>
									上
								</td>
							</tr>
							<tr align="center">
								<td>
									有
								</td>
								<td>
									天
								</td>
							</tr>
						</table>
						<br>
					</td>
					<td>
						只显示上边框
					</td>
				</tr>
				<tr>
					<td>
						<table style="BORDER-COLLAPSE: collapse" borderColor="#3399ff" width="200" border="1" cellspacing="0" cellpadding="0"
							frame=below>
							<tr>
								<td align="center">
									脚
								</td>
								<td align="center">
									下
								</td>
							</tr>
							<tr>
								<td align="center">
									有
								</td>
								<td align="center">
									地
								</td>
							</tr>
						</table>
					</td>
					<td>
						只显示下边框
					</td>
				</tr>
				<tr>
					<td>
						<br>
						<table style="BORDER-COLLAPSE: collapse" borderColor="#3399ff" width="200" border="1" cellspacing="0" cellpadding="0"
							frame=vsides>
							<tr>
								<td align="center">
									上不着天
								</td>
								<td>
									&nbsp;
								</td>
							</tr>
							<tr>
								<td>
									&nbsp;
								</td>
								<td align="center">
									下不着地
								</td>
							</tr>
						</table>
						<br>
					</td>
					<td>
						只显示左、右边框
					</td>
				</tr>
				<tr>
					<td>
						<table style="BORDER-COLLAPSE: collapse" borderColor="#3399ff" border="1" cellspacing="0" cellpadding="0" frame=hsides
							width="200">
							<tr>
								<td align="center">
									去掉两边
								</td>
								<td></td>
							</tr>
							<tr>
								<td></td>
								<td align="center">
									只剩“王”字
								</td>
							</tr>
						</table>
					</td>
					<td>
						只显示上、下边框
					</td>
				</tr>
				<tr>
					<td>
						<br>
						<table style="BORDER-COLLAPSE: collapse" borderColor="#3399ff" width="200" border="1" cellspacing="0" cellpadding="0"
							frame=lhs>
							<tr>
								<td width="100" align="center">
									只
								</td>
								<td width="100" align="center">
									有
								</td>
							</tr>
							<tr>
								<td align="center">
									左
								</td>
								<td align="center">
									边
								</td>
							</tr>
						</table>
						<br>
					</td>
					<td>
						只显示左边框
					</td>
				</tr>
				<tr>
					<td>
						<table style="BORDER-COLLAPSE: collapse" borderColor="#3399ff" width="200" border="1" cellspacing="0" cellpadding="0"
							frame=rhs>
							<tr>
								<td width="100" align="center">
									只
								</td>
								<td width="100" align="center">
									有
								</td>
							</tr>
							<tr>
								<td align="center">
									右
								</td>
								<td align="center">
									边
								</td>
							</tr>
						</table>
					</td>
					<td>
						只显示右边框
					</td>
				</tr>
				<tr>
					<td>
						<br>
						<table style="BORDER-COLLAPSE: collapse" borderColor="#3399ff" width="200" border="1" cellspacing="0" cellpadding="0"
							frame=void>
							<tr>
								<td align="center">
									四周
								</td>
								<td align="center">
									去掉
								</td>
							</tr>
							<tr>
								<td align="center">
									只留
								</td>
								<td align="center">
									中间
								</td>
							</tr>
						</table>
					</td>
					<td>
						不显示任何边框
					</td>
				</tr>
				<tr>
					<td colspan="2">
						<hr size="1" color="#3399ff">
						表格边框的显示与隐藏，是可以用frame参数来控制的。请注意它只控制表格的边框图，而不影晌单元格。
						<br>
						只显示上边框 &lt;table frame=above&gt;
						<br>
						只显示下边框 &lt;table frame=below&gt;
						<br>
						只显示左、右边框 &lt;table frame=vsides&gt;
						<br>
						只显示上、下边框 &lt;table frame=hsides&gt;
						<br>
						只显示左边框 &lt;table frame=lhs&gt;
						<br>
						只显示右边框 &lt;table frame=rhs&gt;
						<br>
						不显示任何边框 &lt;table frame=void&gt;
					</td>
				</tr>
			</table>
		</center>
	</body>
</html>

 

cnsd007
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
html设置table border,用css来设置table的border
weixin_39904268的博客
06-25 2443
在网页中table是一种很好的展示数据的标签。默认情况下，table是没有border的，但是我们为了好看，经常要给table加上border。而且IE7/8/9下border的颜色还不一样，下面我们就来看看如何用css来控制table的border的显示。首先，我们创建一个简单的table，代码如下：first rowfirst rowsecond rowsecond row初始样式很简单：.m...
webfrom- 遍历html生成table.pdf
08-21
<table border="1" cellpadding="0" cellspacing="0" width="80%"> 序号 业务类型 业务编码 满板数量 主料编码 维护人员 维护时间 编辑 for (int i = 0; i < _dt....
tableExport.js 导出表格
weixin_39570075的博客
07-14 5945
1. 需要引入的js&lt;script src="../plugins/table-export/bootstrap-table-export.min.js"&gt;&lt;/script&gt; &lt;script src="../plugins/table-export/tableExport.js"&gt;&lt;/script&gt;2. 我这里使用的是bootstrap-table ...
管理员页面设计案例：admin_list.html
热门推荐
龍雅的博客
07-25 1万+
一、准备工作（页面中用到的图片和图标设计） 二、页面设计 1、给页面所有元素设置统一样式 /* 0.给所有元素统一设置一些样式： 将所有元素的默认边距归零，防止影响后期的布局 */ * { padding: 0; margin: 0; } 2、框架设计div 代码如下： /* 1.给网页分区并设置每个区域的尺寸 */ div { bo...
python+HTMLTable，生成html表格
qq_38312411的博客
10-13 5132
python，html
element el-table 滚动边框去除
qq_40806920的博客
11-05 2365
el-table__header , .el-table__body, .el-table__footer { width: 100% !important; }, .el-table__header colgroup col[name='gutter'] { width: 0px !important; } 亲测有用 当列表数据多滚动时 出现滚动条，滚动条可以去掉但是 留下的滚动条的宽去除不掉，可以考虑使用这个 搞了好久 好多次都没弄， 下面这一段更改滚动条样式 ，搜刮过..
html_dom_api.rar
03-04
11.3、Border 和 Margin 属性 21 11.4、Layout 属性 22 11.5、List 属性 23 11.6、Positioning 属性 24 11.7、Printing 属性 24 11.8、Table 属性 25 11.9、Text 属性 25 11.10、标准属性 26 12、Table 对象 26 12.1...
一个属性border-collapse解决Table的边框问题
09-25
表格的边框算是页面制作中最头痛的，带边线的表格在之前非常讨厌做，不过今天终于解决了这个问题，下面将示例与大家分享下
给table的tr添加border-top时没有效果的解决方法
12-09
解决办法如下： 复制代码代码如下:table{ border-collapse: collapse;}
使用HTML开发商业网站-table标签属性课件.pptx
07-10
使用HTML开发商业网站 <table>标签属性 表格 属性 描述 常用属性值 border 设置表格的边框（默认border="0"为无边框） 像素值 cellspacing 设置单元格与单元格边框之间的空白间距 像素值（默认为2像素） cellpadding...
node-v9.6.0-x86.msi
04-29
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
Python基于机器学习的分布式系统故障诊断系统源代码，分布式系统的故障数据进行分析，设计故障诊断模型，高效地分析并识别故障类别
04-29
基于技术手段（包括但不限于机器学习、深度学习等技术）对分布式系统的故障数据进行分析，设计故障诊断模型，高效地分析并识别故障类别，实现分布式系统故障运维的智能化，快速恢复故障的同时大大降低分布式系统运维工作的难度，减少运维对人力资源的消耗。在分布式系统中某个节点发生故障时，故障会沿着分布式系统的拓扑结构进行传播，造成自身节点及其邻接节点相关的KPI指标和发生大量日志异常
JavaScript前端开发的核心语言前端开发的核心语言
最新发布
04-29
javascript 当今互联网时代，JavaScript已经成为了前端开发的核心语言它是一种高级程序设计语言，通常用于网页的交互和动态效果的实现。JavaScript的灵活性以及广泛的使用使得它变得异常重要，能够为用户带来更好的用户体验。 JavaScript的特点之一是它的轻量级，它可以在网页中运行无需单独的编译或下载。这意味着网页可以更快地加载并且用户无需安装额外的软件才能运行网页上的JavaScript代码。此外，与HTML和CSS紧密结合，可以直接在HTML文档中嵌入，使得网页的开发变得非常便捷。 JavaScript具有动态性，它可以在浏览器中实时修改页面内容和样。它可以通过操作DOM（文档对象模型来动态地修改网页的结构和布局，并且可以根据用户的行为实时地响应各种事件，如点击、标悬停、滚动等。这使得开发者可以轻松地为网页添加交互性和动态效果，提供更好的用户体验。 JavaScript也是一种面向对象的语言。它支持对象、类、继承、多态等面向对象编程的概念，使得代码结构更加清晰和可维护。开发者可以创建自定义的对象和方法，对功能进行封装和复用，提高代码的可读性和可维护性。
四则运算自动生成程序安装包
04-29
四则运算自动生成程序安装包
基于Linux的私有文件服务器(网盘).zip
04-29
基于Linux的私有文件服务器(网盘)
源代码-access 管理 系统 API 文件.zip
04-29
源代码-access 管理 系统 API 文件.zip
海康机器人智能读码器工业协议操作手册V1.0.2.pdf
04-29
海康机器人智能读码器工业协议操作手册V1.0.2.pdf
256ssm-mysql-jsp 在线捐赠系统.zip（可运行源码+数据库文件+文档）
04-29
根据需求，确定系统采用JSP技术，JAVA作为编程语言，MySQL作为数据库。整个系统要操作方便、易于维护、灵活实用。主要实现了系统用户管理、注册用户管理、信息发布管理、医疗物品分类管理、项目信息管理、捐赠项目管理、志愿者申请管理、个人求助管理、个人捐赠统计、系统管理等功能。 前台用户模块包括： 1. 首页：网站打开的第一个页面，显示网站的最新信息。 2. 用户注册/登录、3. 新闻资讯、4. 暖心故事、5. 我要求助、6. 我要捐赠、7. 我们的项目、8. 志愿者中心：实现志愿者中心的列表显示、9. 系统简介、10. 在线留言、11. 用户后台 后台管理员模块包括： 1. 系统用户管理、2. 注册用户管理、3. 信息发布管理、4. 医疗物品分类管理、5. 项目信息管理、6. 捐赠项目管理、7. 志愿者申请管理、8. 个人求助管理：管理员可以设置个人求助审核状态，可以删除个人求助审核信息。 9. 个人捐赠统计：管理员可以查看个人捐赠统计信息。 10. 系统管理：管理员可以对留言板信息进行查看、回复或删除 关键词：医药捐赠系统；JSP;MySQL
系统性文献综述的撰写（Systematic Review）-范文2.pdf
04-29
参考范文：Findings on Teaching Machine Learning inHigh School: A Ten -Year SystematicLiterature Review 用于学习研究，侵权请联系本人删除
*{ margin: 0; padding: 0; } html,body{ height: 100%; } body{ width: 100%; background-image:radial-gradient(#22002a,#01001f) } a{ text-decoration: none; } #movie_info{ width: 990px; margin: 0 auto; padding-bottom: 60px; box-sizing: border-box; } #movie_info .info{ width: 100%; padding-bottom: 15px; border-bottom: 1px dotted rgb(255,255,255,0.3); } #movie_info .info img{ float: left; box-shadow: 0 0 6px #C4C4C4; margin-top: 36px; } table{ margin-top: 20px; margin-right: 10px; float: right; color: white; font-size: 13px; } table,tr,td,th{ border: none; } th{ font-size: 22px; text-align: left; height: 38px; line-height: 38px; color: #fdfed2; } td{ width: 240px; line-height: 24px; } table a{ display: block; width: 100px; height: 30px; line-height: 30px; border-radius: 5px; color: #FFFFFF; text-align: center; margin-top: 15px; } table .lookInfo{ background-image:linear-gradient(#9ac534,#427e22) ; } table .buy{ background-image:linear-gradient(#ff8b45,#ff5200) ; } table .score{ color: #f2a32e; } table .score .star{ margin-left: 15px; display: inline-block; width: 103px; height: 20px; background: url(../images/star_big.png) left -80px no-repeat; } table .score em{ font-size: 28px; color: #f2a32e; } #movie_info .info:after,#movie_info ul:after{ content: ""; display: block; clear: both; } /*猜你喜欢*/ #movie_info .like{ position: relative; } #movie_info .like span{ position: absolute; top: 10px; left: 25px; display: block; width: 100px; height: 30px; line-height: 30px; border-radius: 2px; background:rgb(220,216,216, 32%); color: #FFFFFF; text-align: center; font-size: 12px; } #movie_info .like ul{ width: 990px; height: 190px; position: absolute; top: 50px; left: 25px; overflow: hidden; } #movie_info .like ul:after{ content: ""; display: block; clear: both; } #movie_info .like li{ width: 119px; text-align: center; float: left; margin-right: 20px; font-size: 12px; color: #e1ab5b; line-height: 20px; cursor: pointer; } #movie_info .like li img{ width: 119px; height: 168px; }。每行代码加上注释
06-01
html,body{ height: 100%; } body{ width: 100%; background-image: radial-gradient(#22002a,#01001f); /* 设置背景颜色 */ } a{ text-decoration: none; } /* 电影信息区域 */ #movie_info{ width: 990px; ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值