怎么设置HTML表格细边框

html-css011

怎么设置HTML表格细边框,第1张

一般用表格的时候总会给它个border属性,比如:<table border="1">,其效果如下:

可以发现表格的边框好像很宽,当然这里的“很宽”绝对不是表格border的宽,会看到的宽应该是<td>之间有间隙所致。因此只需 要修改表格的cellspacing属性即可,即:<table border="1px" cellspacing="0px">,效果如下:

但是,这个宽度只有一个像素的宽,其实,上图看到的其实是两个像素的宽,为什么呢,这是因为<td>之间的边框没有重合所致。修改表格的border-collapse属性即可,

即<table border="1px" cellspacing="0px" style="border-collapse:collapse">

再给表格加个颜色:

<table border="1px" bordercolor="#000000" cellspacing="0px" style="border-collapse:collapse">

HTML语句中“border=1”是边框为1像素的意思。

border 是 CSS 的一个属性,用 border 可以给能确定范围的 HTML 标记(如 TD、DIV 等等)画边框,它可以定义边框线的类型、宽度和颜色,利用这个特性,可以制作一些特殊效果。

一、border-width:thin medium thick 10px

上边框是细边框,右边框是中等边框,下边框是粗边框,左边框是 10px 宽的边框。

二、border-width:thin medium thick

上边框是 10px,右边框和左边框是中等边框,下边框是粗边框。

三、border-width:thin medium

上边框和下边框是细边框,右边框和左边框是中等边框。

四、border-width:thin

所有 4 个边框都是细边框。

扩展资料:

边框其他样式:

none 定义无边框。

solid 定义实线。

dotted 定义点状边框。在大多数浏览器中呈现为实线。

dashed 定义虚线。在大多数浏览器中呈现为实线。

double 定义双线。双线的宽度等于 border-width 的值。

groove 定义 3D 凹槽边框。其效果取决于 border-color 的值。

ridge 定义 3D 垄状边框。其效果取决于 border-color 的值。

inset 定义 3D inset 边框。其效果取决于 border-color 的值。

outset 定义 3D outset 边框。其效果取决于 border-color 的值。

inherit 规定应该从父元素继承边框样式。

参考资料:百度百科-border

可能很多除使用Dreamweaver的网友对其中的表格属性的设置还不是很了解,想要让html

表格边框有细线的效果,首先我们得要让边框像素为最小,其次它的内边距等都得为零,一起看看具体的设置方法吧。

Dreamweaver

html

表格边框细线效果怎么实现?

方法一:

1、按图所示,最重要的一点,我没有点实际视图,是方面给大家演示出来的效果。

2、然后可以根据大家的需求来选择。我们直接来看效果吧!

方法二:

1、首先打开Dreamweaver

CS6创建一个表格

2、边框粗细为1像素,单元格边距和间距为零。(默认状态即可)

方法三:

1、我们点实时视图看预览的表格边框比较粗,实际上在浏览器观看也是一样的,我就不贴图了。

2、在table标签里面添加一个style内嵌样式,复制下面的代码。

复制内容到剪贴板

style="

border-collapse:collapse

border-width:thin

border-style:solid"

3、然后让我们开下点下图片里的实际视图。一目了然。按道理说应该完善了。但是如果有需要的话,加点颜色会更好。

总结:以上就是全部的Dreamweaver

html

表格边框细线效果怎么实现相关内容了,不知道大家是否已经了解了呢。