カテゴリー
ホームページ製作

font awesomeで疑似要素だと表示されない

bootstrap4.1で、昨日までのエラー処理。
一つは、navbarの文字色の件で、
<ul class=”nav”>が間違いで、正解は<ul class=”navbar-nav”>だった。

もう一つ、navbarの挙動がページによって違う件で、
jquery-3.3.1.slim.min.jsとpopper.min.jsとbootstrap.min.jsがページによって正しく指定されていなかった。

bootstrap4.1で、今日嵌まったところ。
font awesomeで疑似要素だと表示されない件。
fa-chevron-rightだと表示されるのに、fa-twitterだと表示されなかった。


fa-chevron-rightでは、
.site::before {
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  font-weight: 900;
}
で
  font-family: "Font Awesome 5 Free";
を書き、
fa-twitterでは、
.site::before {
  font-family: "Font Awesome 5 Brands";
  content: "\f105";
  font-weight: 400;
}
で
  font-family: "Font Awesome 5 Brands";
と書かなければならなかった。

【参考サイト】
https://niwaka-web.com/fontawsome5_css/

font-weightばかり気をとられ嵌まったな。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です