你们好，最近小未来发现有诸多的小伙伴们对于导航条的制作，导航条这个问题都颇为感兴趣的，今天小活为大家梳理了下，一起往下看看吧。

1、 链接列表。我们可以利用这个链表理论来构建自己的导航栏，这样可以得到更加丰富的网页效果。

2、 ul

3、 lia href='default.asp'Home/a/li

4、 lia href='news.asp'News/a/li /ul

5、 更多的申请表格；我们还可以通过对CSS语句进行一定程度的变换，使用更多的语句形式。保险商实验所

6、 {

7、 list-style-type:none;

8、 margin:0;

9、 padding:0;

10、 }

11、 垂直导航栏。这也是一个网页中常见的现象，我们可以通过简单的代码实现这样的风格。

12、 a

13、 {

14、 display:block;

15、 width:60px;

16、 }

17、 水平导航栏。对于这样一种导航栏的形式，我们是非常容易实现的，而且这种实现方式也是分两种方式来完成的。一个是内联列表项，另一个是浮动列表项。

18、 li

19、 {

20、 display:inline;

21、 }

22、 li

23、 {

24、 float:left;

25、 }

26、 a

27、 {

28、 display:block;

29、 width:60px;

30、 }

31、 例子。在实际的网页设计中，我们会应用一个变量导航条，而这个导航条在代码设计中更复杂。

32、 style

33、 ul

34、 {

35、 list-style-type:none;

36、 margin:0;

37、 padding:0;

38、 overflow:hidden;

39、 }

40、 li

41、 {

42、 float:left;

43、 }

44、 a:link,a:visited

45、 {

46、 display:block;

47、 width:100px;

48、 font-weight:bold;

49、 color:#FFFFFF;

50、 background-color:#bebebe;

51、 text-align:center;

52、 padding:3px;

53、 text-decoration:none;

54、 text-transform:uppercase;

55、 }

56、 a:hover,a:active

57、 {

58、 background-color:#cc0000;

59、 }

60、 /style

61、 媒体类型。同一个网页在不同的媒体上有不同的显示方式，我们需要分别为这些媒体设置不同的显示方式。“语音系列”是用来听的，“字体大小”是用来显示的，等等。

以上就是导航条这篇文章的一些介绍，希望对大家有所帮助。