零基础学做网站培训介绍

当前位置:

网页table表格样式设置方法(css设置table样式)

以下为学做网站论坛关于“网页table表格样式设置方法(css设置table样式)”讲解视频教程。

通过网页制作教程上节课怎样在网页中添加表格,我们就可以在网页中插入一个表格,但往往插入的表格并不美观,我们需要设置一些表格参数去达到我们要求的界面。

table表格的样式设置

设置网页表格样式参数如下:

  • 行数,顾名思义,它定义的是表格一共有多少行,只能填整数数字。
  • 列数,定义表格的列数,只能填整数数字。
  • 表格宽度,定义表格的总宽度,可直接填入数值,后面的宽度选项,分为像素和百分比,当宽度单位为百分比时,表格的宽度可以根据浏览器的宽度自动伸展。
  • 边框粗细,定义表格的外边框宽度。
  • 单元格边距,它定义的是单元格中的内容与单元格边框的宽度,也就是单元格内的空白。

表格在我们导航网站制作过程会经常用到。生成的Table表格代码如下:


<table width="100%" border="1">
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>

我们可以在HTML代码里加上border="1"来设置表格的边栏样式,同样也可以使用CSS来控制table样式。

CSS设置表格边框

CSS设置表格边框


table{border:1px solid #F00}

CSS给单元格添加边框

CSS给单元格添加边框


table td{border:1px solid #ddd;}

CSS设置表格边框合并

CSS设置表格边框合并


table
{
border-collapse:collapse;
}

CSS 设置表格的宽度和高度

CSS 设置表格的宽度和高度


table td{
width:80px;
height:30px;
}

CSS 设置表格背景


table{background:url(images/bg.jpg) repeat;}

相关阅读:

网页中table表格如何修改边框颜色

CSS如何控制Table表格实现自适应

table自适应:CSS控制table表格宽度超出网页的方法

发表评论

邮箱地址不会被公开。 必填项已用*标注

相关教程

  • 网页如何添加背景音乐 视频教程附件下载 (1110574 次浏览)
    在上网过程中,有很多网站打开后会自动播放背景音乐,而且只有当关闭网页之后背景音乐才会停止。在我们自己建网站,同样也可以给自己的网页添加背
  • 通过网页制作教程上节课怎样在网页中添加表格,我们就可以在网页中插入一个表格,但往往插入的表格并不美观,我们需要设置一些表格参数去达到我们要求
  • table表格是网页制作中以前较常使用的一种布局方式,但随着DIV+CSS的兴起,table表格已辉煌不在。但它在我们制作网页中也是时有用到。table表格也可以
  • 怎样在网页中嵌入表格 视频教程 (1113737 次浏览)
    网站如果需要使用一些数据时,使用表格来显示是特别好的方法。表格的优点在于它可以简洁明了地将图片、文本、数据和表单有序的显示在页面上,在不同的
  • page页面可以单独使用不同页面模板,这个我们都知道了,那怎么给不同的single文章页面设计不同模板呢?我们有二种方法: 第一种:通过代码来判断
  • 我们知道,网站伪静态可以形成静态页面,对于百度收录有着最大的好处。(相关知识:Discuz论坛后台SEO优化设置详细步骤)对于DISCUZ论坛程序实
  • 在网站布局过程中,运用div+css的布局是特别有利的,通常我们需要对一个div层进行居中处理,那么如何通过css属性对它进行控制呢:下面分享一个建网页