css ul li 导航条水平显示

css 里面有个属性叫做 display , 能够实现许多效果。

比如 display:block, 即 用要显示的内容，把 width 填满,而不是默认的  有多长 显示多长

display:inline, 则是 取消前后换行符

• 标签组成的 导航条，默认情况下 会 竖直显示。可以靠 display:inline 来做到水平显示。

  更多 display 的功能 ，可以参考 文档 ，搜索 html display 就能找到好多。

  
  

  下面是

  • 水平显示的具体例子:

    
    
    
    
    
    	
    
    
    
    
    
    
    	
    
    	
    
    		
    Mission
    		
    History
    		
    Executive Team
    		
    Contact Us
    	
    	
    
    
    
    
    
    

    
    

    css:

    nav ul
    {
    	list-style:none;
    	display:inline;
    }
    
    nav li
    {	
    	width:200px;
    	display:inline-block;
    	background-color:red;
    }