inset

inset: 1em;

inset: 5% 0;

inset: 2em 50px 20px;

inset: 10px 30% 20px 0;

inset: 0;

<section id="default-example">
  <div class="example-container">
    <div id="example-element">我处于绝对定位状态。</div>
    <p>
      街道上四处泥泞，像是洪水刚刚从大地上退去一般，倘若此时你在霍尔本山腰间遇上一只大约四十英尺长的斑龙，如同巨象一般横冲直撞地进入山中，那也不足为奇。
    </p>
  </div>
</section>

.example-container {
  border: 0.75em solid #ad1457;
  padding: 0.75em;
  text-align: left;
  position: relative;
  width: 100%;
  min-height: 200px;
}

#example-element {
  background-color: #07136c;
  border: 6px solid #ffa000;
  color: white;
  position: absolute;
  inset: 0;
}

/* <length> 值 */
inset: 10px; /* 所有边距都应用相同的值 */
inset: 4px 8px; /* 上/下 左/右 */
inset: 5px 15px 10px; /* 上 左/右 下 */
inset: 2.4em 3em 3em 3em; /* 上 右 下 左 */
inset: calc(anchor(50%) + 10px) anchor(self-start) auto auto;
inset: anchor-size(block) calc(anchor(50%) + 10px) auto
  calc(anchor-size(width) / 4);

/* <percentage> 值表示相对于包含区块的宽度（左/右）或高度（上/下）的百分比 */
inset: 10% 5% 5% 5%;

/* 关键字值 */
inset: auto;

/* 全局值 */
inset: inherit;
inset: initial;
inset: revert;
inset: revert-layer;
inset: unset;

<div>
  <span class="exampleText">示例文本</span>
</div>

div {
  background-color: yellow;
  width: 150px;
  height: 120px;
  position: relative;
}

.exampleText {
  writing-mode: sideways-rl;
  position: absolute;
  inset: 20px 40px 30px 10px;
  background-color: #c8c800;
}