Wordpres追加CSSについて

Question

WordPressの追加CSSでhタグを変更したいと思いサルワカのサイトからcssをコピーしたのですがデザインが適応されていないようでした。

サイトにあるCSSをコピーすれば下記のようなものを実現できるとあったのですが、ロケットの部分がうまく表示されませんでした。

変更したところはh1だったところをh4にしただけです。h4では使えないのでしょうか？

h4 {
position: relative;
background: #ffd98a;
padding: 2px 5px 2px 25px;
font-size: 20px;
color: #474747;
border-radius: 0 10px 10px 0;
}

h4:before {
font-family: "Font Awesome 5 Free";
content: "\f135";
display: inline-block;
line-height: 40px;
position: absolute;
padding: 0em;
color: white;
background: #ffa337;
font-weight: normal;
width: 40px;
text-align: center;
height: 40px;
line-height: 40px;
left: -1.35em;
top: 50%;
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
border: solid 3px white; 
border-radius: 50%;
}

Comments

[akihiro3]

css自体は読み込まれてますか？

Answer 1

下記の設定が必要です。

【【保存版】Font Awesomeの使い方：Webアイコンフォントを使おう】
https://saruwakakun.com/html-css/basic/font-awesome#section2