bootstrap实现导航自适应对于不同的设备

  先说一件小事（嘿嘿，也是吐槽一件事），曾经的曾经面试过一家公司，这家公司说是想用bootsrap做网站，主要是适配从移动端到PC端。当时我所在的公司PC端所做的网站就是用bootstrap做的，但是呢当时公司要求只是适配1024px以上便可。因为当时公司移动端有专门人员负责相关的内容，没必要在网站这块投入人力物力财力在为PC端的页面增强适配性。

    但是呢当时面试官拿着手机访问时适配性不好，然后就死劲说适应性不行。当时我也是使劲浑身解数解释。毕竟不管结果如何，都要为自己的时间负责。

     不同的行业融入互联网，不可能相同，但是知识的本质是不变的。..总之，找工作容易，找一份合心的工作不易~~~哈哈，且行且珍惜~~~

    接下来是为我的手艺加砖添瓦部分哦~~~~~~

...............................................................以下是正文.........................................................

先看图

屏幕分辨 >768px或是768px

 

屏幕分辨率<768

           

这是同一个页面同一套代码只是在不同的分辨下表现不同。且看下面代码

二、代码

编写一个线上页面，从无到有，从框架到内容细节的完善，到最后上线优化维护，其实就像建一座大厦一样。只是完成周期不同罢了。当然这也说明在编写页面时的一种思路，先html布局框架，然后css做相应的装修，然后进行细节完善。

html

  

        
        

         
            Toggle navigation
           
           
           
         
         
       

       
      

            

               
• 首页 (current)

               
• 上门试车

               
• 
                    众筹试车
                   
  
                     
  
                     
  • One more separated link
  
                     
  
                     
  • Action
  
                     
  
                     
  • Another action
  
                     
  
                     
  • Something else here
  
                     
  
                     
  • Separated link
  
                     
  
                     
  • One more separated link
  
                   
  
                 

               
• 车展2015

               
• 极客

               
• 问答

               
• 关于我们

            

      

  

css

js

PS：别忘了引入bootstrap的css库、js库，以及jQuery库

转载于:https://www.cnblogs.com/wjh0916/p/5007041.html