页眉工具栏和页眉按钮

页眉是网页身体的头不一样.下面我们演示下在页面工具栏中添加两个连接,中间一个标题.

show the code:

    
                
            
                            
    
        
     
                
      返回            
      
 主界面 
            
      更多        
     
    
    
          

导航工具栏

导航工具栏是 jQuery Mobile 的小部件.像tab页,像navbar一样.下面演示下,音乐的一个网页的案例:

show the code:

    
                
            
                            
    
        
     
                
      返回            
      
音乐 
            
      更多            
      
                
       
                    
        
古典
                    
        
流行
                    
        
摇滚
                
       
            
      
        
     
                
     
              
      
I am a single collapsible element 
            
      
I am the content inside of the single collapsible element
        
     
              
    
      

页脚工具栏

页脚工具栏,下面实现按钮并排显示,两端按钮边角变为圆角:

(左图不是圆角,右图是圆角.代码就是相差个div)

show the code:

    
                
            
                            
    
        
     
                
      返回            
      
音乐 
            
      更多            
      
                
       
                    
        
古典
                    
        
流行
                    
        
摇滚
                
       
            
      
        
     
                
     
              
      
I am a single collapsible element 
            
      
I am the content inside of the single collapsible element
        
     
            
     
           
      
                
       千千静听                
       QQ音乐                
       酷我音乐           
      
        
     
      
    
      

定位工具栏

定位工具栏,上面我们都用过了.定位工具栏是否已经在可视化范围内.要是工具栏使用固定位子,我们只需要将该属性添加进去:

data-position="fixed".

也可以在page div中使用全屏定位.我们只需要 <div data-role=”page” data-fullscreen=”true”>