Dreamweaver网页制作初级教程:导航按钮的定义

 时间:2026-02-15 02:38:14

1、上节,我们讲述了div缝隙的定义,那么导航栏怎么来定义呢?今天小编就跟大家说一下。

Dreamweaver网页制作初级教程:导航按钮的定义

2、我们这次的定义,当然应该在

   <div id="header_b">

下方定义,因为是子集关系,定义代码为:

            <div class="menu">首页</div>

Dreamweaver网页制作初级教程:导航按钮的定义

3、当然,导航不可能一个,所以我们输入:

<div class="menu">首页</div>

                <div class="menu">电影</div>

                <div class="menu">图片</div>

                <div class="menu">影评</div>

Dreamweaver网页制作初级教程:导航按钮的定义

4、当然,我们这些应该继续在css中定义,因为他也是样式的一种,但是,定义方式发生了改变。不用#了,而应该用.

代码:

.menu{width:200px;height:20px;background-color:#63F;float:left}

Dreamweaver网页制作初级教程:导航按钮的定义

5、那么新的问题出现了,我们设置的导航页,既没有居中对齐,而且最后还空出来了底色,并不美观。

Dreamweaver网页制作初级教程:导航按钮的定义

6、那么,应该如何将它修改呢。

文字居中的代码为:

text-align:center

Dreamweaver网页制作初级教程:导航按钮的定义

7、然后,我们用代码:

margin-left:2px

可以让导航栏出现2像素的小缝隙,以便美观和观察。

Dreamweaver网页制作初级教程:导航按钮的定义

8、预览一下:

Dreamweaver网页制作初级教程:导航按钮的定义

  • dreamweaver cs6设置滚动字幕的操作
  • 网页中如何图片的显示/渐隐效果
  • HTML怎么给文字添加下划线,以及设置大小写字体
  • Dreamweaver5中如何设置网页的背景色??
  • 怎样在flash中创建蓝色椭圆
  • 热门搜索
    调侃怎么读 怎么设置呼叫转移 肌酐偏高怎么治疗 淀粉酶高是怎么回事 怎么玩 怎么做表格 电费怎么算 冬虫夏草怎么食用 饺子馅怎么调才好吃 外文文献怎么找