Material Design Lite响应式CSS不适用于移动设备/平板电脑或Chrome DevTools仿真器

当试用Google的Material Design Lite的响应功能时，此代码在调整浏览器窗口大小时隐藏了消息，但是当我查看我的页面在Chrome DevTools设备模拟器或实际设备上，它只显示“桌面”版本。我如何解决我的HTML？Material Design Lite响应式CSS不适用于移动设备/平板电脑或Chrome DevTools仿真器

<html> 
    <head> 
    <link rel="stylesheet" href="https://storage.googleapis.com/code.getmdl.io/1.0.1/material.indigo-pink.min.css"> 
    </head> 
    <body> 
     <div class="mdl-cell--hide-phone mdl-cell--hide-tablet"> 
      You are on a desktop 
     </div> 
     <div class="mdl-cell--hide-desktop mdl-cell--hide-tablet"> 
      You are on a phone 
     </div> 
     <div class="mdl-cell--hide-desktop mdl-cell--hide-phone"> 
      You are on a tablet 
     </div> 
    </body> 
</html>

来源

2015-10-09 taylor

要解决MDL不结垢为不同的设备，里面添加这一行你的HTML的<head>：

<meta name="viewport" content="width=device-width, initial-scale=1.0">

来源

2015-10-09 17:33:53 taylor

Material Design Lite响应式CSS不适用于移动设备/平板电脑或Chrome DevTools仿真器

回答

相关问题