本篇文章主要介绍了"css水平导航栏"，主要涉及到方面的内容，对于CSSjrs看球网直播吧_低调看直播体育app软件下载_低调看体育直播感兴趣的同学可以参考一下：
导航栏基本上是一个链接列表，一般结构如下：
- Home
导航栏基本上是一个链接列表，一般结构如下：
<ul><li><ahref="default.asp">Homea>li><li><ahref="news.asp">Newsa>li><li><ahref="contact.asp">Contacta>li><li><ahref="about.asp">Abouta>li>ul>
但是由于li元素是块级元素，所以这样无样式规定的话做出来的是垂直导航栏。
想要实现css水平导航栏，两种方法：
方法一.内嵌列表项，设置li元素display：inline;
方法二：浮动列表项，设置li元素浮动 float：left；
今天主要想记录的是两种实现方法的区别:
用第一种方式实现的话会存在两个问题：
1）默认a标签之间会有一定的间距（具体默认是多少就不知道了）
2）由于li标签和a标签都是行内元素（这里的a标签不能修改为display属性，否则会改变li的属性），这就导致一个问题就是a标签的长度是由内容撑起的，所以在给它设置背景色之后就会发现不同导航块的长度可能是不同的。 但是也并不是没有解决办法，比如将li标签元素和a标签元素都设置为inline-block，可以解决上面两个问题，但是这样写的话似乎缺少一定的规范性。
而用第二种方法是比较推荐的做法
首先设置li的浮动属性；
然后修改a标签display为block；
之后设置a标签宽度；
这样就可以保证a标签之间没有默认的间距，而且各个a标签的宽度是相等的，即看起来标签是等长的就比较美观。
').addClass('pre-numbering').hide();
$(this).addClass('has-numbering').parent().append($numbering);
for (i = 1; i <= lines; i++) {
$numbering.append($('').text(i));
};
$numbering.fadeIn(1700);
});
});
以上就介绍了css水平导航栏，包括了方面的内容，希望对CSSjrs看球网直播吧_低调看直播体育app软件下载_低调看体育直播有兴趣的朋友有所帮助。
本文网址链接：http://www.codes51.com/article/detail_372356.html
