dw导航条制作教程(dw导航条文字怎么制作)
本文目录一览:
Macromedia Dreamweaver 8怎么样制作漂亮的导航条
dw只是做拼接的,漂亮的导航条是要先用ps制作出好看的图片,通过css调整布局和样式,再加上js的效果。dw只是在这里起一个综合整理的作用。具体的可以在网上搜一下导航条或者js导航条之类的,下一些例子,照着改改。
厄,ps出来的当然是图片,有了图片后,关于图片间的衔接,美化什么的,就要用到css啊,如果要有滑动效果,css+js就可以了。你去搜js特效或css特效,一般这种地方都会有导航条的例子。
如何用DW制作导航条
兄弟,你要做网页,代码肯定是要学的 不懂可以私
相信我,慢慢来不难的,我帮你写好了,你只需要修改自己喜欢的样式即可
并且所有要修改样式的地方我都帮你备注好了
您只需要把 这堆东西放入head/head两个标签之间的中间
style
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: BLACK; /*导航栏背景颜色*/
}
li {
float: left; /*在导航栏内对齐方式*/
}
li a {
display: block;
color: white; /*字体颜色*/
text-align: center; /*字居中*/
padding: 14px 14px; /*框大小*/
text-decoration: none; /*把a标签自带的下划线去掉*/
}
li a:hover {
background-color: #228B22; /*鼠标经过框框时的背景颜色*/
font-size: 25px; /*鼠标经过时字体大小*/
}
/style
在把 这堆放在body/body之间
ul
lia class="9e6b-eda1-0092-a67b active" href="#home"主页/a/li
lia href="#news"新闻/a/li
lia href="#contact"联系/a/li
lia href="#about"关于/a/li
/ul
示例页面HTML
!DOCTYPE html
html
head
meta charset="utf-8"
title导航栏/title
style
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: BLACK; /*导航栏背景颜色*/
}
li {
float: left; /*在导航栏内对齐方式*/
}
li a {
display: block;
color: white; /*字体颜色*/
text-align: center; /*字居中*/
padding: 14px 14px; /*框大小*/
text-decoration: none; /*把a标签自带的下划线去掉*/
}
li a:hover {
background-color: #228B22; /*鼠标经过框框时的背景颜色*/
font-size: 25px; /*鼠标经过时字体大小*/
}
/style
/head
body
ul
lia class="eda1-0092-a67b-93e7 active" href="#home"主页/a/li
lia href="#news"新闻/a/li
lia href="#contact"联系/a/li
lia href="#about"关于/a/li
/ul
/body
/html
DW网页导航条的制作。请大家教下! 附图
可以叠加,那就是先把那张图的背景做为那个表格或单元格的背明景,然后就可以在上面再放一张图片了,
鼠标经过图像的制作:
在DW8中,如果要制作鼠标经过图像倒也简单,插入一张图后,点窗口
行为
点+号
选交换图像,在浏览那选择鼠标移上时的图,勾选预先载入图和滑开时恢复图点确定就可以了。