我创建了一个新的polymer网站，如果我在手机上打开它，响应式设计将不起作用。 (但我应该因为它是纸抽屉面板)
==> https://www.sese7.de/polymer/
代码:
<!DOCTYPE html>
<html>
<head>
<script src="bower_components/webcomponentsjs/webcomponents.js"></script>
<link rel="stylesheet" href="css/style.css">
<link rel="import" href="elements/elements.html">
</head>
<body>
<home-main>
<login-main>
</login-main>
</home-main>
</body>
</html>
模块:
<dom-module id="home-main">
<template>
<style>
</style>
<paper-drawer-panel id="pdp">
<div drawer style="background-color: #dfdfdf;">
</div>
<div main>
<paper-toolbar>
<paper-icon-button icon="menu" paper-drawer-toggle></paper-icon-button>
</paper-toolbar>
<content></content>
</div>
</paper-drawer-panel>
</template>
<script>
Polymer({
is: "home-main"
});
</script>
</dom-module>
我的问题出在哪里？抱歉，我是 polymer 领域的新手。
提前致谢;)
最佳答案
您的布局看起来确实是响应式的，但如果您向 HTML 添加了正确的元标记，它在移动设备上可能看起来更好 <head> 。试试这个:
<head>
<!-- Add this -->
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<script src="bower_components/webcomponentsjs/webcomponents.js"></script>
<link rel="stylesheet" href="css/style.css">
<link rel="import" href="elements/elements.html">
</head>
关于javascript - 纸抽屉面板上的响应式布局不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33454923/