UserCSS:ページヘッダー

変数定義

code:style.css

:root {

--main-color: DarkGray; /* 主調色 */

/* 5 ページのヘッダー画像 */

}

ページヘッダー（画像表示する場合）

code:style.css

.page::before {

display: block;

content: ''; /* */

/*content: '💖'; /* */

width: 1em; /* */

height: 1em; /* */

padding: 48px 80px; /* */

/* width: 72px; /* */

/* height: 48px; /* */

/* padding: 48px 72px; */

/*padding-bottom: 24px;*/

/*position: absolute;*/

/*position: right bottom;*/

position: left top; /* */

/*ここに画像へのリンクを貼る*/

background-image: var(--page-header-image); /* */

background-size: cover;

border-radius: 4px

}

ページヘッダー（テキスト表示する場合）

code:stylexx.css

.page::before {

content: '💖💖 愛は負けても親切は勝つ';

color: var(--main-color); /* 文字色 */

display: block;

margin-bottom: 2rem;

}

https://img.shields.io/badge/CSS3-UserCSS_ページヘッダー-1572B6.svg?logo=css3&style=for-the-badge

UserCSS.icon