Question

问题

如何删除<paper-button>元素内<paper-dialog>元素周围的所有空白区域？

因此，例如，悬停效果应该一直到边缘。但我仍然希望保留段落文本周围的空白区域。

<小时/> 的演示：

Click this JS Bin了解工作示例代码。
Safari用户特别说明：使用Chrome查看演示。

尝试：

在代码和演示中，我评论了我之前的所有尝试/* No effect */。

代码：

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Polymer Bin</title>

    <base href="http://element-party.xyz">
    <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>

    <link rel="import" href="all-elements.html">

</head>

<body>
<x-element></x-element>


    <dom-module id="x-element">
    <style>
        :host {           /* No effect */
            display: block; /* No effect */
        margin: 0;
        }
        paper-dialog {
            width: 400px;
            margin: 0;   /* No effect */
            padding: 0;  /* No effect */
        }
        paper-button {
            width: 100%; /* No effect */
            margin: 0;   /* No effect */
        }
        paper-dialog::shadow { /* No effect */
            margin: 0 auto;      /* No effect */
            padding: 0 auto;     /* No effect */
        }
        paper-button:hover{
            background-color: black;
            color: white;        
        }
    </style>
        <template>
            <paper-dialog id="dialog">
                <p>
                    I want to remove the white space around the below buttons
                    so the hover effect extends to the edges of this dialog.
                    But I want to keep the white space around this text.
                </p>
                <div class="layout vertical">
                        <paper-button>One</paper-button>
                        <paper-button>Two</paper-button>
                        <paper-button>Three</paper-button>
                </div>
            </paper-dialog>
            <paper-button on-tap="openDialog">Open Dialog</paper-button>
        </template>
        <script>
            Polymer({
                is: 'x-element',
                openDialog: function(){
                    this.$.dialog.open();
                }
            });
        </script>
    </dom-module>


</body>
</html>

Answer 1

我认为你需要对你的选择器尝试更具体一点：

override func didMoveToView(view: SKView) {        
    let image = imageOfCell(CGRectMake(0, 0, 10, 10),scale:0)

    let dict:[String:UIImage] = ["t1":image]

    let texture = SKTextureAtlas(dictionary: dict)
    let sprite1 = SKSpriteNode(texture: texture.textureNamed("t1"))
    sprite1.position = CGPointMake (CGRectGetMidX(view.frame),CGRectGetMidY(view.frame))
    addChild(sprite1)
    println(sprite1.size)

    // prints (30.0, 30.0) if scale = 0
    // prints (10,0, 10,0) if scale = 1
}


func imageOfCell(frame: CGRect, scale:CGFloat) -> UIImage {
    UIGraphicsBeginImageContextWithOptions(frame.size, false, scale)

    var bezierPath = UIBezierPath(rect: frame)
    UIColor.whiteColor().setFill()
    bezierPath.fill()
    let imageOfCell = UIGraphicsGetImageFromCurrentImageContext()!
    UIGraphicsEndImageContext()

    return imageOfCell
}

但是这会对所有paper-dialog div { margin: 0; padding: 0; }元素进行设置，因此我不确定这是不是你所追求的。

Polymer 1.0：如何在<paper-dialog>中删除<paper-button>周围的空白区域？

问题

1 个答案: