新浪首页免费邮件用户注册网站地图
上移动梦网
赢手机大奖

新浪首页 > 科技时代 > 网上学园 > 主页制作 > 正文
可立刻学会网页制作小技巧

http://www.sina.com.cn 2001/05/25 19:17 中国电脑教育报 小龟

  本“菜鸟”其实是学产品造型的,偶然机会被同学拉下了“网海”,谁知道一下来就上不去了,嘻嘻~~这大半年来,在我高手同事的悉心指教和自己“师夷长技以制夷”之精神下,偷学了不少Dreamweaver的小技巧(可都是教材里没有的哦),感觉受益匪浅!好东西不敢独享,还是拿来与像我一般的“菜鸟s(复数形式)”“美文共赏”,你可一定要看哦。


图1

  细框表格

  以前常常看见有些网站中的文字框的边框很细,只有一个像素宽,于是自己也试着在Dreamweaver中调整“Boarder”的宽度为1,并填上颜色,结果如图1,却并不是我所要的效果,后来把别人的网页的源代码研究了一番,才明白其中的奥妙,原来是“Cellpad”的功劳,具体设置请看图2,当然,如果想要得到预想中的效果,还得有点小技巧哦。来看,先选中这个表格,然后在中随意选择任何一种颜色(图中所示为黑色)。接着,取消表格的选择,把鼠标在表格内部点击,当看到有光标闪动后,再次在中选择一种能区别刚才所选的颜色(图中所示为白色),好,这时我们再来看看效果(图3),没错吧!


图2


图3

  文字环绕

  刚开始学习网页制作的网友们也许常遇到这样的问题:插入一幅图后,在这之后输入的文字总是不能自动在图周围排列,而是自动转到下一行了(如图4),想知道怎样让文字能环绕图片排列吗?好,Follow me!


图4

  选中你插入的图,在属性框的右边“Align”下拉菜单中点选“left”,接着我们就开始输入文字,哈哈,瞧,文字是不是自动地在图片的右边和下边环绕了(如图5)?在“Align”下还有很多选项,你一个个都试试,相信你一试就明白!


图5

  插入竖线

  我们常看到网页中有一个像素宽的细竖线,怎样实现呢?相信您看过第一条秘技后应该也能触类旁通了吧,不过这儿我将教您另一个方法,就是插图,也许您会觉得插入一幅这么长的直线图会增大文件量,但是有没有比较节省的办法呢?当然有!假设您所要插入的直线是1个像素宽的,那么请打开Fireworks,新建一个长宽都为1像素的文件,填上您喜欢的任何颜色,点“File/Export preview”,在弹出框中的左上角的文件类型下拉菜单中选“gif”,在下面的颜色数量框中填写1,好了,点“Export”保存文件,取文件名为1.gif。回到Dreamweaver,在适当的位置插入刚才制作的1.gif,选中它,在属性框里的高度一栏中填上你喜欢的任何高度,OK,就这么简单,我们完成了由“点”到“线”的工作,而文件多大呢?才59字节(根据笔者经验,这是最小的文件了,不可能再压缩了)!

  BTW,我个人认为Fireworks的输出性能相当好用,如今我做网站Banner几乎都是采取这样的程序:在Flash里做好动画,输出成动画.gif文件,然后再用Fireworks对它进行每一帧的时间设置和色彩数量的设定,这样做出的文件既能达到美观的要求,又尽可能地降低了文件大小,适应了网络的要求,实在是一举两得啊!哦,还要提醒一下,gif动画不支持Flash里的“Movie clip”,这一点一定要注意哦!^_^

  解决表格紧贴左上方问题

  这大概是多数网友不大会注意的问题,其实有时也会有这种特殊需要的,在此,我提供三中方法供读者选择。

  方法一:“Ctrl+J”,弹出Page Properties,将“Left”、“Top”、“Margin”、“Width”、“Margin Height”全部设为0。

  方法二:把下面一段代码加到你的<body>中topmargin=“0”leftmargin=“0”

  方法三:方法二只适用于IE,如果让其也适用Netscape加入下面代码

  <body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">



发表评论】【初学者园地】【科技聊天】【关闭窗口

新 闻 查 询

 相关链接
【学园专题】主页制作步步高
主页Banner制作好帮手--Banner Maker Pro (2000/08/30 18:47)
迈出主页制作第一步-HTML代码分析 (2000/05/23 11:46)


网站简介 | 用户注册 | 广告服务 | 招聘信息 | 中文阅读 | Richwin | 联系方式 | 帮助信息 | 网站律师

Copyright © 1996 - 2001 SINA.com, Stone Rich Sight. All Rights Reserved

版权所有 四通利方 新浪网