css - pinterest.com の左上隅に 3 行のボタンを作成する方法は?

Question

ボタン自体ではなく、3行について話している。pinterest.com の左上隅にある 3 行を、画像を使用せずに純粋な CSS でどのように作成しますか? その小さなボタン スペースに収まる 3 本の線をエレガントにするにはどうすればよいでしょうか。

Answer 1

HTML:
<div class="line-separator"></div>

CSS:
.line-separator { height:1px; background: #999; border-bottom: 1px solid #333; }

background線の色を変更しborder-bottom、ドロップ シャドウ効果を与えます。好みに合わせて色を調整します。