Dreamweaver中如何制作漂亮的导航条按钮

  1.首先创建一个1x6的表格,参数为:border=0 cellspacing=3 cellpadding=0;
2.在这个表格的每个单元格内分别插入一个表格,宽度和高度设为100%;
3.建立一个CSS样式.up和.down;代码如下:
<style>
.up{
border:4 outset royalblue;color:yellow;background:blue;cursor:hand
}
.down{
border:4 inset royalblue;color:#33ff33;background:blue;cursor:hand
}
</style> 
4.对插入的表格调用样式和行为,代码如下:
class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouseOut="className='up'" onclick=window.open("button.htm","_blank")
注意:链接请用onclick,不要用href,因为后者访问后有虚线框,不美观。现在存盘看看效果吧! 

时间: 2024-10-03 05:04:26

Dreamweaver中如何制作漂亮的导航条按钮的相关文章

用Fireworks制作简单金属导航条

导航 PS作者:天外飞猪 http://www.yesky.com/20020820/1626109.shtml 这是一篇短小精悍的教程,非常适合初学者. 漂亮的导航条为我们的网站增色不少,现在我们来看一个例子,这个别具特色的导航条主要充分运用了Fireworks MX渐变功能. 1.新建一个以白色为背景的400*50 pixels的文件.用矩形工具(按U键)画一长方形,并填充颜色,连按两次G键,打开渐变工具,对矩形进行填充,如图: 颜色分别为#FFA621,#333333,#FFA621,按V

Bootstrap中定制LESS-颜色及导航条(推荐)_javascript技巧

 主题色 在variables.less文件的开始,可以看到灰色及品牌色的默认变量及其值 @gray-darker: lighten(#000,13.5%); //#222 @gray-dark 我们可以直接进行替换,以涵盖我们所需的完整灰度空间 @gray-darker: #222; @gray-dark: #454545; @gray: #777; @gray-light: #aeaeae; @gray-lighter: #ccc @gray-lightest: #ededed @offwh

WPS演示中怎么制作带图片的图标按钮

  WPS演示中怎么制作带图片的图标按钮           1.打开WPS演示,新建空白文档,把里面的文本框全部删除. 2.点击菜单栏--插入--形状. 3.选择一款图标样式. 4.鼠标按住不放,在空白处画出该图标. 5.右击图标,选择设置对象格式. 6.在颜色与线条标签,点击颜色后面的小三角符号,选择填充效果. 7.然后切换到图片标签,点击插入图片. 8.在本地选择一张精美的图片,插入. 9.OK了,看看制作的图标,是不是很精美呢?

Dreamweaver如何制作导航条按钮

看到上面的导航条了吗?你可以点击一下看看它的效果,请注意,这可是用表格做出来的,你相信吗?其实代码很简单,现在让我们来看看该怎么做. 1.首先创建一个1x6的表格,参数为:border=0 cellspacing=3 cellpadding=0: 2.在这个表格的每个单元格内分别插入一个表格,宽度和高度设为100%: 3.建立一个CSS样式.up和.down:代码如下: <style> .up{ border:4 outset royalblue;color:yellow;background

Dreamweaver用表格巧妙制作导航条按钮

看到上面的导航条了吗?你可以点击一下看看它的效果,请注意,这可是用表格做出来的,你相信吗?其实代码很简单,现在让我们来看看该怎么做. 1.首先创建一个1x6的表格,参数为:border=0 cellspacing=3 cellpadding=0: 2.在这个表格的每个单元格内分别插入一个表格,宽度和高度设为100%: 3.建立一个css样式.up和.down:代码如下: <style>.up{border:4 outset royalblue;color:yellow;background:b

Flash MX 2004实例制作视频教程:导航条的制作

导航|教程|视频教程 第 40 节:导航条的制作 课程目标:制作一个简易的网站导航条. 课程要点:使用Flash MX2004制作一个简易的网站导航条,主要应用了按钮及脚本实现.例中使用到的ActionScript脚本请下载源文件查看. 观看教程:[全屏观看] (2.60MB) (必须安装Flash Player 7.0或更高版本的播放器,[官方下载]) 下载教程:[下载教程] [下载源文件] 本节实例效果预览:

PhotoShop设计制作网页头部导航条教程

效果 1, 在PS中新建文件,宽度定义为1000px,实际上我们所要用到的宽度一般在950px-980px之间.为了方便更好的展示网站的整体效果.所以文件的宽度应大于网页实际的宽度.高度自定,但最好要大于整个页面的高度,在没有办法确定页面的高度范围时,我们可以把高度定到大于网页高度.这样,整个页面制作好了.我们可以使用裁切工具.将多余的部分裁切掉. 2, 这个实例,以网站实际宽度为800像素为例进行操作.为了加快制作流程,节省制作的时间成本.我通常的做法是:a,选矩形选框工具;b,定义固定宽度8

css制作3D按钮式导航条

<html> <head> <title>3D按钮式导航条</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <style> body{text-align:center;background:#ffffff} .up{ border:3 outset royalblue;color:yell

用表格巧妙制作导航条按钮

看到上面的导航条了吗?你可以点击一下看看它的效果,请注意,这可是用表格做出来的,你相信吗?其实代码很简单,现在让我们来看看该怎么做. 1.首先创建一个1x6的表格,参数为:border=0 cellspacing=3 cellpadding=0: 2.在这个表格的每个单元格内分别插入一个表格,宽度和高度设为100%: 3.建立一个css样式.up和.down:代码如下: <style>.up{border:4 outset royalblue;color:yellow;background:b