1. ホーム
  2. css

[解決済み】ボックスにサイズ/部分的なボーダーを宣言する方法はありますか?

2022-02-19 01:46:16

質問

CSSでボックスのサイズ/部分的なボーダーを宣言する方法はありますか?例えば 350px のみで、その最初のボーダー・ボトムを表示します。 60px . それはとても便利かもしれないと思います。

解決方法は?

そうでもないんです。しかし、優雅に劣化し、余計なマークアップを必要としない方法で、その効果を得ることは非常に簡単です。

div {
  width: 350px;
  height: 100px;
  background: lightgray;
  position: relative;
  margin: 20px;
}

div:after {
  content: '';
  width: 60px;
  height: 4px;
  background: gray;
  position: absolute;
  bottom: -4px;
}
<div></div>