文字の下または上に線（ライン）を引く方法

上に線（ライン）を表示

SCSS
1
2
3
4
5
6
7
8
9
10
p {
    &::before {
        content: "";
        width: 3em;
        height: 1px;
        background: #333;
        display: block;
        margin: 1em 0;
    }
}

下に線（ライン）を表示

SCSS
1
2
3
4
5
6
7
8
9
10
p {
    &::after {
        content: "";
        width: 3em;
        height: 1px;
        background: #333;
        display: block;
        margin: 1em 0;
    }
}

before と after が異なるだけ。