Question

我想创建这样的东西：

我准备了以下测试页面：

＆＃13;

<!DOCTYPE html>
<html>

<head>
</head>

<body>

  <p>Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text.
    Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text.Here will be a text. Here will be a text.
    Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text.Here will be a text. Here will be a text. Here will be a text.
    Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text.</p>

</body>

</html>

＆＃13;

box-shadow

＆＃13;

然而，Chrome和Firefox的结果有所不同。从我的观点来看，Chrome版本还可以，但我不喜欢Firefox中的结果。

铬

火狐

在Firefox中如何实现与Chrome相同的结果？我对任何解决方案持开放态度，没有必要使用public void SetOrderProperty(string orderPropertyName, string value) { PurchaseOrder purchaseOrder = TransactionLibrary.GetBasket().PurchaseOrder; OrderProperty orderProperty = purchaseOrder.OrderProperties.FirstOrDefault(x => x.Key == orderPropertyName); if (orderProperty != null) { orderProperty.Value = value; orderProperty.Save(); } else { OrderProperty op = new OrderProperty { Key = orderPropertyName, Value = value, Order = purchaseOrder }; op.Save(); } purchaseOrder.Save(); TransactionLibrary.ExecuteBasketPipeline(); }属性。

Answer 1

不是box-decoration-break:clone你追求的是什么？

＆＃13;

lazy var managedObjectContext: NSManagedObjectContext? = {
    // Returns the managed object context for the application (which is already bound to the persistent store coordinator for the application.) This property is optional since there are legitimate error conditions that could cause the creation of the context to fail.
    let coordinator = self.persistentStoreCoordinator
    if coordinator == nil {
        return nil
    }
    var managedObjectContext = NSManagedObjectContext()
    managedObjectContext.persistentStoreCoordinator = coordinator
    return managedObjectContext
    }()

＆＃13;

p {
  display: inline;
  background-color: yellow;
  box-shadow: 10px 0px 0px red, -10px 0px 0px red;
  box-decoration-break: clone;
}

＆＃13;

Answer 2

根据您的评论发布此答案

以下是使用 :after 根据您的图片获取结果的变通办法。

p {
  display: inline;
  line-height:20px;
  background-color: yellow;
  position:relative;
}
.p-wrapper{
  position:relative;
  display:inline-block;
}
.p-wrapper:after{
  content:'';
  background:#000;
  position:absolute;
  left:-10px;
  right:-10px;
  top:-10px;
  bottom:-10px;
  z-index:-1;
}

<!DOCTYPE html>
<html>

<head>
</head>

<body>
<div class="p-wrapper">
  <p>Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text.
    Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text.Here will be a text. Here will be a text.
    Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text.Here will be a text. Here will be a text. Here will be a text.
    Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text. Here will be a text.</p>
    </div>

</body>

</html>

Chrome和Firefox中box-shadow的不同行为

2 个答案: