防止CSS剪切路径剪切子级吗？

问题描述

有什么方法可以防止剪切路径剪切其子级吗？例如，考虑以下代码：

Is there any way to prevent clip-path from clipping its children? For example, consider the following code:

.el {
  width: 300px;
  height: 300px;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  background-color: orangered;
}

h1 {
  position: relative;
  z-index: 100;
}

<div class="el">
  <h1>Work Hard, Play Hard</h1>
</div>

推荐答案

基本上是什么

尼克A 说：

某些东西正在消失中……但是您想让它出现，

Having something be the child of something that is disappearing... but you want that to appear, doesn't make too much sense.

相反，将您要显示的东西放在正在消失的东西之外...这样，它就不会消失/得到

Instead, place the thing you want to be shown outside the thing that is disappearing... that way it doesn't disappear/get clipped.

这就像ram vinoth所说。

This is like ram vinoth said.

这篇关于防止CSS剪切路径剪切子级吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！