Polymer - Paper Icon Button
Paper-icon-button 是一个操作按钮，代表设置等特定操作。当用户触摸按钮时，会产生涟漪效果。您可以将这些按钮用作链接，也可以为按钮添加一些样式，如以下示例所示。要在您的目录中获取 paper-icon-button 和 iron-icons，您应该在命令提示符中运行以下命令以使其正常工作。
bower install --save PolymerElements/paper-icon-button
示例
您的 index.html 文件应如下所示。
<!doctype html>
<html>
<head>
<link rel = 'import' href = 'my-app.html'>
</head>
<body>
<my-app></my-app>
</body>
</html>
你的 my-app.html 文件应如下所示.
<link rel = 'import' href = 'bower_components/polymer/polymer.html'>
<link rel = "import" href = "bower_components/iron-icons/iron-icons.html">
<link rel = "import" href = "bower_components/paper-icon-button/paper-icon-button.html">
<dom-module id = 'my-app'>
<template>
<h3>Paper-Icon-Button Example </h3>
<paper-icon-button icon = "settings" ></paper-icon-button>settings
<br>
<paper-icon-button icon = "warning" style = "color: red;" ></paper-icon-button>warning
<br>
<paper-icon-button icon = "content-cut" ></paper-icon-button>content-cut
<br>
<paper-icon-button icon = "dashboard" ></paper-icon-button>dashboard
<br>
<paper-icon-button icon = "flight-takeoff" ></paper-icon-button>flight-takeoff
<br>
</template>
<script>
Polymer ({
is: 'my-app',
ready: function() {
this.async(function() {
});
}
});
</script>
</dom-module>
输出
刷新 Polymer 服务器，以下是输出。
polymer_elements.html
