cellspacing,cellpadding妙用

最新推荐文章于 2023-01-07 20:51:53 发布
最新推荐文章于 2023-01-07 20:51:53 发布
阅读量1.3k 收藏
点赞数
文章标签： button table function border input
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/student4java/article/details/6065384
版权

1.关于介绍 ：以下为最好的演示地址：http://www.w3school.com.cn/tiy/t.asp?f=hdom_table_paddspac

为防止演示地址无效 加上演示代码

<html>
<head>
<script type="text/javascript">
function padding()
  {
  document.getElementById('myTable').cellPadding="15"
  }
function spacing()
  {
  document.getElementById('myTable').cellSpacing="15"
  }
</script>
</head>
<body>

<table id="myTable" border="1">
<tr>
<td>100</td>
<td>200</td>
</tr>
<tr>
<td>300</td>
<td>400</td>
</tr>
</table>
<br />
<input type="button" οnclick="padding()" value="改变 Cellpadding">
<input type="button" οnclick="spacing()" value="改变 Cellspacing">

</body>
</html>

 

 

 

 

2.利用这两个属性 设置 表格边框，效果还可以

<table align="center" cellspacing="0"  cellpadding="0" bgcolor="#999999">
 <tr>
  <td >
   <table align="center" cellpadding="0" cellspacing="1" >
    <tr valign="middle">
       <td width="100" align="center" bgcolor="#FFFFFF">asds</td>
      <td width="100" align="center" bgcolor="#FFFFFF">dsa</td>
      <td width="100" align="center" bgcolor="#FFFFFF">s</td>
      <td width="100" align="center" bgcolor="#FFFFFF">s</td>
      <td width="100" align="center" bgcolor="#FFFFFF">s</td>
      <td width="100" align="center" bgcolor="#FFFFFF">s</td>
     </tr>
    <tr align="center">
       <td width="100" valign="middle" bgcolor="#FFFFFF">asds</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">dsa</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
     </tr>
    <tr align="center">
       <td width="100" valign="middle" bgcolor="#FFFFFF">asds</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">dsa</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
     </tr>
    <tr align="center">
      <td width="100" valign="middle" bgcolor="#FFFFFF">asds</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">dsa</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
     </tr>
    <tr align="center">
       <td width="100" valign="middle" bgcolor="#FFFFFF">asds</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">dsa</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
     </tr>
    <tr align="center">
       <td width="100" valign="middle" bgcolor="#FFFFFF">asds</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">dsa</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
      <td width="100" valign="middle" bgcolor="#FFFFFF">s</td>
     </tr>
    </table>
  
  </td>
    </tr>
</table>

student4java
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JAVAWEB HTML 标签 表格table
chengqingshihuishui的博客
08-30 671
表格语法： table 表格；tr 行标签；th 表头标签（就多一个加粗，一般第一行使用）；td 单元格标签。 <table 【border="1" width="500" height="200" align="center" cellspacing="0"】> <!--生成了一个3*3表格--> <tr> <th 【colspan="2"】 > 表头内容 </th> <!--colspan 从此单元格起，行
cellpadding与cellspacing
奔跑的蜗牛
10-06 4268
1、cellpadding：边距指的是表格的单元格的内容与单元格边界之间空白距离的大小。 2、cellspacing：可设置或返回在表格中的单元格之间的空白量（表格中各个单元格之间的距离）（以像素为单位）。 3、实例 （1）未使用cellpadding与cellspacing [html] view plain copy ⃕ print? > 
1、Javaweb_HTML&table布局
qq1092881420的博客
01-07 1566
* JavaWeb： * 使用Java语言开发基于互联网的项目* 软件架构： 1. C/S: Client/Server 客户端/服务器端 * 在用户本地有一个客户端程序，在远程有一个服务器端程序 * 如：QQ，迅雷... * 优点： 1. 用户体验好 * 缺点： 1. 开发、安装，部署，维护 麻烦 2. B/S: Browser/Server 浏览器/服务器端
CSS中cellspacing和cellpadding属性用法揭秘
wang880117的博客
04-25 851
CSS中cellspacing和cellpadding属性用法揭秘
在html语言中，cellpadding="0" cellspacing="0"是什么意思啊？
热门推荐
qq_33180279的博客
06-14 1万+
这两个参数都是html中table标签的参数。 cellpadding 是边框与其内容的间隙大小； cellspacing 是边框与边框之间的间隙大小；
HTML cellpadding与cellspacing属性图文详解
09-28
例如，可以使用`padding`属性替换`cellpadding`，使用`border-collapse`和`border-spacing`属性替换`cellspacing`。`border-collapse`用于决定单元格边框是否合并，`border-spacing`则用来设置单元格之间的间距。 ...
JS动态修改表格cellPadding和cellSpacing的方法
10-24
主要介绍了JS动态修改表格cellPadding和cellSpacing的方法,涉及javascript操作cellPadding和cellSpacing属性的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
cellpadding=0 cellspacing=0的css替代写法
09-25
本文将详细探讨如何使用CSS来替代`cellpadding=0`和`cellspacing=0`的写法，并讲解其背后的原理和优势。 首先，我们来看如何用CSS替换`cellpadding=0`。在CSS中，`padding`属性用于设置元素的内边距。当希望消除...
IE6/7中使用setAttribute设置table的cellpadding和cellspacing的Bug
09-25
本文将详细讨论一个特定的问题，即在IE6/7中使用JavaScript的setAttribute方法设置table的cellpadding和cellspacing属性时出现的bug。 首先，我们需要了解`cellpadding`和`cellspacing`属性。这两个属性是HTML中...
cellspacing和cellpadding的区别
07-08
在实际应用中，`cellspacing` 和 `cellpadding` 经常与`border`属性结合使用，以实现更精细的表格布局。通过调整这些属性，开发者可以创建出满足设计需求的复杂表格，提高网页的可读性和美观度。同时，了解这些基础...
html5中不再支持table的cellspacing和cellpadding属性
weixin_30511039的博客
05-04 1072
如果你现在开始用html5的声明来写页面时，你会发现在定义table的cellspacing和cellpadding时被提示该属性已过时或者提示非法属性。具体原因是在html5中table标签的这两个属性已经被移除，需要定义边框之类的时应该使用css的写法。 具体实现如下： <!DOCTYPE html> <html xmlns="http://www.w3.org/1...
table cellpadding属性无效
Jimmy_Lee
05-03 7468
设置了table的对象的cellpadding属性后，如果table单元格间没有出现指定padding间距，那么应该设置过td的样式，增加了padding:0px的样式，这样设置table的cellpadding就不起作用了。   　　查找导入此页面的css文件或者内联style样式，找到类似的样式
CSS中表示cellpadding和cellspacing的方法
蒗若晨曦
01-11 1486
CSS有很多值得学习的地方，本文向大家描述一下用CSS来表示表格的cellpadding和cellspacing方法，希望对你的学习有所帮助。 本文和大家重点讨论一下用CSS来表示表格的cellpadding和cellspacing方法，表格的cellpadding和cellspacing我们经常会用一定的方式来清除默认样式，请看下文详细介绍。 用CSS来表示表格的ce
html中cellpadding属性作用,table标签cellpadding属性的作用及使用方法
weixin_29290379的博客
06-05 1万+
在html中制作表格，需要用到table标签，而该标签中的cellpadding属性可设置单元格边距大小，下面我们就一起学习一下cellpadding属性的作用及使用方法。标签cellpadding属性定义和用法cellpadding属性指定单元格边框和单元格内容之间的空白部分(以像素为单位)。HTML5中不支持的cellpadding属性，请使用CSS样式的padding(内边距)设置单元格边距...
cellpadding的含义
weixin_33762130的博客
09-20 336
cell -- 一个小格 pad -- 垫子 cellpadding=10 就是在原有小格的基础上沿四边各加上10 个点子宽度，也就是把原来的小格变大，但原来写的内容占的大小范围不变。 cellpadding 用于&lt;TABLE&gt;. 下面是一个完整的HTML,你可存为 a.html 你可用notepad 编辑，修改cellpadding=10的值为0和20，用IE浏览，你就一目了然它的意...
cellpadding，cellspacing都是废弃的属性了，早已不推荐使用，最新的html5里已经彻底去掉了这些表现型的属性。
ole_triangle_java的博客
01-10 4743
cellpadding，cellspacing都是废弃的属性了，早已不推荐使用，最新的html5里已经彻底去掉了这些表现型的属性。 正确的做法是，合并表格边框，然后用th，td的padding设置内容和边框之间的空隙。 table { border-collapse: collapse; } th, td { padding: 0.3em 1em; } 另外补充一点，尽早放弃在html里
html的table标签cellpadding和cellspacing不起作用的问题！
weixin_34326429的博客
01-10 2430
2019独角兽企业重金招聘Python工程师标准>>> ...
在html5中不支持<table>的cellpadding 和 cellspacing的替代方案
Quincylk的专栏
08-21 8370
原文：https://www.cnblogs.com/cbza/p/7147214.html 在html5中不支持&lt;table&gt;的cellpadding 和 cellspacing ; 2) 如何用css实现 cellpadding, cellspacing ; 3) tr , th 是 有 border, 没有 padding 的. 1.初始: ​​​​&lt;!DOCTYP...
cellspacing和cellpadding
最新发布
03-16
cellspacing和cellpadding是HTML表格中的两个属性。 cellspacing指的是单元格之间的间距，即单元格边框之间的距离。 cellpadding指的是单元格内容与单元格边框之间的距离，即单元格内部的空白区域大小。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值