#質問
HPのサイドバーにFontAwesomeを追加する方法が分かりません…。
検索してもWordPressばっかり出てきて参考にならない。
リンクの前に表示したいのに、リストが改行されて二行で表示されてしまいます。
HTML
<div id="sidebar">
<p class="sidetitle">*** カテゴリ ***</p>
<ul class="localnavi">
<li><a href="#">*** リンク ***</a></li>
</ul>
</div>
CSS。
.sidetitle {
text-decoration: none;
display: block;
width: 132px;
padding: 0.5em 1em 0.5em 2.3em;
background-color: #808080;
color: #fff;
border:none;
}
/* -- リスト -- */
.localnavi {
list-style-type: none!important; /* ulの中黒を消す。 */
margin-bottom: 2em;
}
.localnavi li { display: inline; }
.localnavi li a {
text-decoration: none;
display: block;
width: 170px;
padding: 0.5em 5px;
background-color: none;
color: black;
border-bottom: 1px solid #cccccc;
}
.localnavi a:hover {
text-decoration: none;
background-color: black;
color: white;
border-bottom: 1px solid #ff0000;
}
で、入れようとした FontAwesomeが以下。
.localnavi li:before {/*疑似要素*/
font-family: FontAwesome;
content: "\f138";/*アイコンの種類*/
color: skyblue;/*アイコン色*/
}
WordPressに関係する話は不要です。
一緒に読まれている質問
13 件の回答
…自己解決しました。(間抜け)
.localnavi li a { のpadding:を5pxから10pxに変更。
.localnavi li:beforeを .localnavi li a:before に変更でできました。
前に隙間がないから隠れてしまっていたのか……。
HPってなんですか?
Re:3
ヒューレット・パッカードの略に決まってんだろ!
Re:4
その文脈からすると、ヒューレット・パッカードのWebサイトのサイドバーにFontAwesomeを追加する方法が自己解決したということになりますね!主はかなりのハッカーですね。
Re:5
こら!
Re:5
アイコン入れてくれるハッカーさんなんて、あら親切。
Re:5
わらたww
……もう少し有益な情報が得られるかと思ってW3Qを利用しているので、こういうやり取りはすごく迷惑です。
同じHPの編集中、過去にh2の装飾方法を聞いたらすごく親切にタグを書いてくださった方がいたので、回答がついていたのをわくわくして開いたんですけれども。
※コーダーでも何でもなく、社内用マニュアルを独学コピペのHTMLとCSSの知識で自主的に作っているだけ。
すねるのは勝手やけど質問の内容的に知恵袋行きやろ
ちゃかすほうもちゃかすほうやが、すねるほうもすねるほうとしか言えんわ
気持ちよく過ごすためにはまわりの雰囲気見て
上手く住み分けを見分けるしかないんやで
頼むから「もうきません」とか捨て台詞はやめてやぁ
Re:9
迷惑ってなんだろうと考えさせられるな。
たぶん、言葉の選び方間違えてる。
Re:10
主じゃないけど、主の心の声に変わって
「もうきませーん!!!」
Re:9
ちゃんとした回答がもらえる方がマレなんやで。
いろんな人いるからね~