DSEGフォントで7セグ風デザインをWebサイトに実装する手順

/home/（あなたが契約した名前）/www/（あなたが作成したフォルダ名）/wp-content/themes/keni8-child/

 /* フォントを定義 */
@font-face {
font-family: 'DSEG7Classic';
src: url('DSEG7Classic-Bold.woff2') format('woff2'),
url('DSEG7Classic-Bold.woff') format('woff');
}

/* フォントの使用 */
.nyanyaseg_txt {
font-family: 'DSEG7Classic', monospace;
font-size: 2.0em;
font-weight: 800;
}

<div class="nya-price-box">
<p class="nya-price-box__number nya-primary">1,235,000</p>
<p class="nya-price-box__txt">円</p>1

@font-face {
font-family: 'DSEG7Classic';
src: url('実際のURL') format('woff2'),
url('実際のURL') format('woff');
font-weight: bold;
font-style: normal;
}
/* ベースボックス */
.nya-price-box {
display: flex;
align-items: flex-end;
margin-top: 8px;
}

/* 数字部 - プライマリー */
.nya-price-box__number.nya-primary {
background: linear-gradient(
#000000 0%,
#1a1a1a 50%,
#2e2e2e 50%,
#3d3d3d 100%
);
}

/* 数字部（共通） */
.nya-price-box__number {
font-family: 'DSEG7Classic', monospace;
position: relative;
display: flex;
justify-content: center;
align-items: center;
border-radius: 8px;
padding: 9px 10px;
width: fit-content;
height: 56px;
color: #fcff0b;
font-size: 36px;
}

/* ブレークポイント：768px 以上 */
@media (min-width: 768px) {
.nya-price-box__number {
padding: 15px 10px;
height: 72px;
font-size: 42px;
}

.nya-price-box__txt {
font-size: 24px;
}
}

.nya-price-box__number::before {
left: 0;
}

/* 単位などのテキスト */
.nya-price-box__txt {
margin-left: 8px;
font-size: 20px;
font-weight: bold;
}