制作简单网站导航步骤

使用Dreamweaver制作导航条会用到css样式,现在就给大家简单的制作一个导航条。

操作方法

  • 01

    使用Dreamweaver新建一个html页,并在<title></title>间添加css样式。

  • 02

    在<body></body>间添加一个div,class是预先写好的top

  • 03

    在div中添加列表<ul><li></li></ul>,保存预览

  • 04

    添加列表样式top ul li{ float:left;},预览一下。

  • 05

    去掉列表前面的点,添加list-style:none;

  • 06

    为导航列表添加宽度、高度、行间距、字号等。

  • 07

    为导航列表添加背景色、边框,并且居中显示。

  • 08

    最终效果,如下图。很简单的制作,如果想要更精美就继续学习css吧。

(0)

相关推荐

  • 怎么制作简单的网页?

    制作简单的网页可能有很多方法,用不同的软件.今天我来介绍一下用Dreamweaver CS5中文版来制作简单的网页步骤.由于DW软件具有可视化的特点,所以学起来很简单,和office word一样简单 ...

  • 微信网站怎么制作 微信网站制作具体步骤图解

    最近微网站又开始火额!很多朋友问小编微信网站怎么做?今天小编就手把手教你如何制作微网站,喜欢的小伙伴们一起来学习下吧! 微信网站怎么做 微信网站制作教程详解 微信网站制作具体操作步骤如下: 第一步:登 ...

  • vs2010制作简单的asp.net网站

    vs2010制作简单的asp.net网站,C#编程环境 操作方法 01 打开visual studio 2010程序开发软件 02 单击菜单栏的文件,依次选新建->网站->ASP.NET空 ...

  • DW软件怎么在网站中制作简单的表单

    在DW软件制作网页中,编辑表单是必须学习的内容,所以今天就由小编来为大家介绍DW软件怎么在网站中制作简单的表单. 操作方法 01 第一首先在DW软件创建站点. 然后再新建一个HTML文件. 02 第二 ...

  • 怎么制作简单干净无广告的U盘启动装系统工具

    现在很多U盘启动工具制作的U盘装系统的时候,都会有一大堆的捆绑软件,下面就教大家怎么制作一个干净无广告的U盘启动工具.微PE工具箱是一款简单实用的U盘启动装系统工具,干净无广告. 操作方法 01 打开 ...

  • 如何利用WPS表格制作小型网址导航?

    如何利用WPS表格制作小型网址导航?当我们在上网时遇到了比较好的网站,往往会把该网站地址添加到收藏夹中,以便下次迅速打开。但是,收藏的地址多了,会看的很乱,也不好找,我们为何不用WPS表格自己制作一个 ...

  • 网站导航系统设计与内部链接策略

    网站导航系统与网站内部链接建设是密不可分的,他们的作用是引导搜索引擎与用户快速准确的找到他们想要的资料或者其他有用的东西.从而能体现网站的价值与吸引力. 操作方法 01 一.网站导航系统 网站导航是对 ...

  • DW制作网页的基本步骤

    操作方法 01 这篇文章主要是针对初学者的,告诉大家如何Dreamweaver制作一个网页?本文具体详细讲解了网页制作方法的基本步骤以及注意的问题,并且拿一个具体的实例来给大家做了一下详细讲解! 网页 ...

  • UleadGIFAnimator (Ulead GIF Animator 5) 制作简单动画教程

    友立公司出版的动画GIF制作软件,内建的Plugin有许多现成的特效可以立即套用,可将AVI文件转成动画GIF文件,而且还能将动画GIF图片最佳化,如何制作简单的动画。 方法/步骤 网络中下载好这个软 ...