見出し
見出しのデザイン
#UserCSS #design #spin-off
ソース: /akio6o6/settings#5ac82404409663000000b01d
対象クラス
.line strong
[[strong]]
aaa
[* level-1]
level-1
[** level-2]
level-2
[*** level-2]
level-2
[**** level-2]
level-2
[***** level-2]
level-2
code:style.css
.line strong {
margin: 0.2em 0;
}
/* 見出しのリンクの下線を非表示にする */
.line strong a:link {
text-decoration: none;
}
.line strong:not(.level-1) .deco-\* {
padding: 0.3em 0;
line-height: 170%;
}
/* Level3以降は左にボーダー */
.line strong:not(.level-1):not(.level-2) .deco-\* {
border-left: solid 5px #29a972;
padding-left: 0.5em;
padding-right: 0.5em;
}
/* Level4以降は下にもボーダー */
.line strong:not(.level-1):not(.level-2):not(.level-3) .deco-\*::after {
display: block;
position: absolute;
content: "";
width: 100%;
height: 4px;
background-color: #D7D7D7;
}
.line strong.level-4 .deco-\* {
border-width: 7px !important;
}
.line strong.level-5 .deco-\* {
border-width: 9px !important;
}