Question

当我用loadingLabel.transform = CGAffineTransform(rotationAngle: CGFloat(0.2)) // rotation line let animationKey = "position.y" CATransaction.begin() let moveYAnimation = CABasicAnimation( keyPath: animationKey) moveYAnimation.fromValue = loadingLabel.frame.origin.y moveYAnimation.toValue = self.view.bounds.size.height moveYAnimation.duration = 2 loadingLabel.layer.add( moveYAnimation, forKey: animationKey ) // Callback function CATransaction.setCompletionBlock { print("end animation") self.loadingLabel.isHidden = true } // Do the actual animation and commit the transaction loadingLabel.layer.add(moveYAnimation, forKey: animationKey) CATransaction.commit()将图像的宽度设置为％时，弹性换行不起作用。我能理解，因为图像与视口成比例。当我将其切换为px时，它可以工作。有没有办法使它保持为％的流畅度，但是当图像小于特定大小时，它会自动换行？

我尝试使用％和px。 Flex包装适用于px，但不适用于％。

flex-wrap: wrap;

* {
        font-family: arial, sans-serif; 
        box-sizing: border-box;}

    html, body {
        margin: 0;
        padding: 0;
    }

    .flex-container {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        margin: .5%;
        padding-top: 100px;
    }

    .flex-container > div {
        text-align: center;
        margin: .5%;
        width: 31%;
        padding: 0;
    }

    @media screen and (max-width:500px) {
        .column {
            width: 100%;
        }
    }

<div class="flex-container">

<div><img src="Images/Printing/Dinner Menus-01.jpg" style="max-width:100%;height:auto;" alt="Banners" /></div>
<div><img src="Images/Printing/Banner.jpg" style="max-width:100%;height:auto;" alt="Posters" /></div>
<div><img src="Images/Printing/Banner.jpg" style="max-width:100%;height:auto;" alt="Poster" /></div>
</div>

是否可以制作包含％图片而不是像素的弹性框？

0 个答案: