CSS見出し 文字大きさ

質問

CSSまったくの素人です。
こちらのサイトからコピペした
https://jajaaan.co.jp/css/css-headline/
上下線グラデーションの見出しの文字の大きさを変更したいのですが
方法がわかりません。

HTML
<h3>CSS見出しデザイン</h3>

CSS
h3 {
position: relative;
padding: 1.5rem 2rem;
color: #000000; text-shadow: 0px 15px 10px #ff8c04;
-webkit-box-shadow: 0 2px 14px rgba(0, 0, 0, .1);
box-shadow: 0 2px 14px rgba(0, 0, 0, .1);
}

h3:before,
h3:after {
position: absolute;
left: 0;
width: 100%;
height: 4px;
content: '';
background-image: -webkit-linear-gradient(315deg, #704308 0%, #ffce08 40%, #e1ce08 60%, #704308 100%);
background-image: linear-gradient(135deg, #704308 0%, #ffce08 40%, #e1ce08 60%, #704308 100%);
}

h3:before {
top: 0;
}

h3:after {
bottom: 0;
}

font-size:をどこへ記載すれば良いのでしょうか？
よろしくお願いいたします。

回答No.2

retorofan · ベストアンサー

No.1です。
補足を拝見しました。

＞h2は他の見出しで使用していますが
h2を複数使用してもSEO等問題ないのでしょうか。

HタグのSEO効果について
Hタグは、ユーザーと検索エンジン双方に重要なテキストを伝えてコンテンツ内容の認識を手助けするので、利便性が高まり、サイト評価向上によるSEO効果が期待できます。

CSSでHタグの仕様を規定しているのですから、
すべてに反映されます。

お礼

retorofanさん、ありがとうございます。
早速、h2に修正します。

回答No.1

retorofan

見出しタグであるH3を用いているのですから、
フォントサイズは下記のいずれかに変更できます。
H1、H2、H3、H4、H5、H6
数字が小さいほど文字が大きくなります。

例 H3からH2にするなら下記のようにします。
------------------------------------
<h2>CSS見出しデザイン</h2>

<style>
h2 {
position: relative;
padding: 1.5rem 2rem;
color: #000000; text-shadow: 0px 15px 10px #ff8c04;
-webkit-box-shadow: 0 2px 14px rgba(0, 0, 0, .1);
box-shadow: 0 2px 14px rgba(0, 0, 0, .1);
}

h2:before,
h2:after {
position: absolute;
left: 0;
width: 100%;
height: 4px;
content: '';
background-image: -webkit-linear-gradient(315deg, #704308 0%, #ffce08 40%, #e1ce08 60%, #704308 100%);
background-image: linear-gradient(135deg, #704308 0%, #ffce08 40%, #e1ce08 60%, #704308 100%);
}

h2:before {
top: 0;
}

h2:after {
bottom: 0;
}
</style>

補足

ご回答ありがとうございます。
h2は他の見出しで使用していますが
h2を複数使用してもSEO等問題ないのでしょうか。
まったくの素人ですみません。
よろしくお願いいたします。