0

我有这个简单的聚合物自定义元素:

<link rel="import" href="../bower_components/polymer/polymer.html">
<polymer-element name="list-row" attributes="header" >
    <template>
        <link rel="stylesheet" href="../bower_components/bootstrap/dist/css/bootstrap.css">
        <style>
            .wrapper
            {
                background-color: #DFF0D8;
                border: 1px solid #468847;
                width: 100%;
                height: 50px;
                line-height: 50px;
                margin-top: 5px;
                margin-bottom: 5px;
            }
            .wrapper :hover
            {
                cursor: pointer;
                background-color: #DFF0B8;
            }
            .wrapper :active
            {
                cursor: pointer;
                background-color: #DFF0B8;
            }
            .header
            {
                font-size: 20px;
                font-weight: 600;
                color: #468847;
            }
        </style>
        <div class="text-center wrapper">
            <span class="header">{{header}}</span>
        </div>
    </template>
    <script>
        Polymer('list-row', 
        {
            header: "no header"
        });
    </script>
</polymer-element>

问题是悬停(和用于测试的动作)不起作用),为什么?

4

1 回答 1

3

您的课程有语法错误。删除空间。

.wrapper:hover
 {
   cursor: pointer;
   background-color: #DFF0B8;
 }
 .wrapper:active
 {
   cursor: pointer;
   background-color: #DFF0B8;
 }
于 2014-06-11T07:52:16.907 回答