网页中的虚线怎么做?
来源:互联网 发布:大连太合网络 编辑:程序博客网 时间:2024/04/28 15:18
A:做一个2*1的图片,一半有色彩,一半透明,存成透明GIF,然后把它设置成单元格背景图,把单元格设置为高度为1,删除其中的 代码即可实现横虚线效果。竖虚线依此类推。
用CSS也可以办到,把border的属性设置为dotted。
方法一:用CSS直接定义。代码如下:
<style>
table{border-collapse:collapse}
td{width:50px;height:20px;border:1px dotted #000000}
</style>
<table>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
</table>
然而用CSS定义的虚线表格有很多弊端:需要IE5.5+支持,虚线的疏密程序不可变等。所以就有第二种方法。
提示:这种做法跟细线表格的第三种方法相似。
方法二:用背景图片实现的虚线表格。
1.在图象处理软件(Firework或者Photoshop)中做一个3X3的图片,中间是1X1大小的色块,色块的颜色就是虚线表格的虚线颜色,图1.2.11是把背景图片放大1600倍后的效果。
图1.2.11 放大到1600倍后的图片
2.在Dreamweaver中按Ctrl+Alt+T插入一个三行三列的表格,选中表格后在属性面板中作如图1.2.12所示的设置。
图1.2.12在属性面板中设置表格的背景图片
3.全选单元格(光标定位到第一个单元格,按住Shift键单击最后一个单元格),然后在属性面板中设置所有单元格的背景颜色,如图1.2.13所示。
图1.2.13 在属性面板中设置单元格的背景颜色
4.保存,预览。效果如图1.2.14所示。
图1.2.14 虚线表格效果预览
注意:背景图片边长大小必须跟表格的 CellSpacing 属性值一致。
提示:这种做法跟细线表格的第一种方法相似。
特别提示
第一种方法做的虚线表格在IE5.0上显示的是实线,效果跟细线表格一样,只有在IE5.5以上的浏览中看到的才是虚线。效果分别如图 1.2.15、图1.2.16所示。
图1.2.15 CSS实现的虚线表格效果(IE5)
图 1.2.16 CSS实现的虚线表格效果(IE6)
特别说明
虚线表格可以说是细线表格的变种,仔细看看,你会发现,主要方法还是跟做细线表格的一样
- 网页中的虚线怎么做?
- 网页制作中的超链接怎么做
- 自适应各种宽度的虚线怎么做?
- 怎么做静态网页
- 网页地图怎么做呢?
- 教你怎么做网页--
- android中的webview加载网页只想显示部分内容改怎么做
- EXCEL虚线怎么去掉
- google怎么做(2.相似网页算法)
- 怎么做一个网页的播放器
- 这样的功能的网页怎么做?
- Photoshop中怎么画虚线
- photoshop中怎么绘制虚线
- photoshop中怎么绘制虚线
- Photoshop中怎么画虚线
- 去除网页上的虚线
- Android 如何做虚线边框
- 怎么给网页中的Flash上加超连接
- proxy.c
- 细线表格http://www.hellowind.com/
- Spring学习笔记之Spring的bean生命周期
- 自动化测试-提高测试效率的途径(1)
- B样条的一个问题的试探(续)
- 网页中的虚线怎么做?
- POJ 2924 Gauß in Elementary School 解题报告
- Proxy源代码分析--谈谈如何学习linux网络编程
- java对zip压缩文件解压缩
- p-unit 教程5 -- 极具说服力的可视化结果
- 对联广告,带关闭,可以移动(2)
- p-unit 最新功能 -- 让你的测试速度和多核成正比!
- 自解压程序去掉"用WINRAR打开"的右键菜单
- MySQL Error Code文档手册