リストを使うと自動的に先頭に丸や四角のマークが付きます。個性を出すためにその先頭のマークを画像などに置き換える、といったカスタマイズをすることもありますが、これが結構大変だったりするんですね。画像の難点は、調度良い形と大きさのものを探してネット上をさ迷い歩くといった放浪の旅に出てしまうことと、大きさが固定のため、リストのフォントの大きさを変えると、いきなりバランスが崩れる!ということです。探すのもカスタマイズも面倒!もうイヤ!と思われ方、きっと多いと思います。(この記事を読んでるあなた!そんな経験ないですか?(笑))そんな方に朗報ですが、今では画像を使わなくてもCSSで色々なマークを簡単に付けられるんですね。まとめ通常のリスト通常リストを使うと、例えば以下のようになりますね。</ul>12345<ul><li>リスト項目1</li><li>リスト項目2</li><li>リスト項目3</li></ul>WordPressの利用しているテーマによって違いが出ますが、通常以下の様な表示になります。Awesome」(フォント・オーサム)というものです。凄いという意味)例えば、上のリスト表示を以下のように出来たり、リスト項目1リスト項目2リスト項目3また以下の様なものも簡単につけられます。Awesome(フォント・オーサム)は「Webフォント」と呼ばれるもので、500種類以上もの様々なマークのフォントが用意されています。画像と違ってフォントですから、CSSの設定を少し変えるだけで、簡単に色や大きさなどを変更でき、見栄えの調整もとても簡単。これを知ってからというもの、私の場合では画像を使うことは全くなくなりました。利用したいフォントを選びましょう。Iconsは正しく表示されないようです下の方にスクロールしてみると、とても多くの種類のフォントがあることが分かります。この中から利用したいものを選び、以下のようにその文字コードを取得します。ここではページをズーッと一番下までスクロールして以下の「heart」を選んでみまましょう。「heart」をクリックすると...このように大きく詳細が表示され、「Unicode」と書かれた部分の右に文字コード(ここでは”f004′′)が表示されますので、これをコピーして利用します。セットするCSSCSSで以下のコードをセットしますが、先頭の「content」に取得した「f08a」を「\f004」という形でセットします。.5em;}すると...リスト項目1リスト項目2リスト項目3むふふふ、しっかりハートマークがリストの先頭に表示されましたね!フォントの色を変えてみるフォントの色を変えるのは、普通にCSSでフォントの色を指定するのに同じです。」を追加すればOKです。箇所を好きな色コードを指定すれば、文字色も自由自在。上の例では以下の様な表示に変わります。リスト項目1リスト項目2リスト項目3フォントの大きさを変えてみるではフォントの大きさも変えてみましょう。pxで指定すればOKです。リスト項目1リスト項目2リスト項目3FontAwesomeの種類、文字色、フォントの指定など、画面を見ながら色々検討したい!といった場合には、以下の記事にあるグーグルのツールを利用してみてくださいね。Awesome」(フォントオーサム)といったものがあるリストへの反映はCSSを使えば簡単にできるフォントと同じ扱いのため、文字色や文字の大きさなどの設定も自由自在!一昔前では想像できませんでしたが、リストなどの先頭にマークを付けたい場合には、もう画像など探さずフォントを使えば良い時代になっています。今でも小さなアイコンなどの無料素材配布のサービスが多くありますが、極端に言えばそれらのサービスもいつかは不要になり、他のものと絶対違うものを!という場合以外では、誰でも手軽にクオリティーの高いものが利用できるようになってます。外注さんに依頼するサービスも多くありますし、こういったサービスも出てきました。これからは自分であれこれ時間を割いてパワーを掛けて作り上げる、というよりは、どれを選ぶか、どういった組み合わせで何を使うか、といったセンスと記事自体のクオリティーの勝負になってきている、と言えそうですね。date*日本語が含まれない投稿は無視されますのでご注意ください。JIN】コンサルタント・コピーライター・ウェブデザイナー、プランナーとして活動中。本格的に取り組みだした2年目2016年には年収1000万円突破、2017年5月に自動化で月収170万突破。多忙な時期を過ごすが、自由に憧れ退職、海外移住し、ネットビジネスの道へ入る。現在は海外にいながら自分らしく生きるとは何かを追求するとともに、主に日本国内、またその他海外に住むネットで収入を得たい方に対し、いかにネットビジネスを成功に導き、時間や場所、不要な人間関係にとらわれず自由を得る人、会社、社会に依存しないで自由に稼ぐ人を増やすことに全力を注いでいます。!!初心者だった頃「こういったものが欲しい!」と心に描いていた想いを形に制作した、ネットビジネス学習の決定版!知識ゼロ、これから始める初心者の方、年齢、性別問わず、初歩の初歩からどなたにも楽しみながら学べるコンテンツ。月収10万、そしてさらにそれ以上を目指せる知識を学べます。Cruise』を完全無料で手に入れる!!メルマガのご案内に説明動画があります。運営者情報プライバシーポリシーお問い合わせ受講者なんと2500名突破!正しい努力は必ず報われる。稼げないのは努力の仕方が違うから。評判のメールマガジンで、一人でも生きていける力、稼げる力を身に付ける。