長野県長野市・松本市ウェブ制作事業部 コンサルテイングFARM

CSSのcontentプロパティ

ATFコンサルティングFARM

ATFコンサルティングFARM

マーケティングがあなたのビジネスの目標達成を支援します。

HubSPot+ ATFC担当に相談する

CSSの擬似セレクタである「:before」と「:after」はcontentプロパティというものが使える。
これがまたWEBを彩る要素として非常に便利で、最近多用する。
最初は、IE7以下が未対応ということもありリストにちょっとしたアイコンを付けたくても避けてきた手法だが、数々のモダンブラウザの台頭により、そろそろ使っても問題ないだろうと思い、今では躊躇なく使っている。

16進数値文字も挿入可能

contentプロパティ

contentプロパティで挿入出来るものは画像やテキスト。よく使うのは「»」や「«」。リストやボタンに使うことが多い。テキストは2バイト文字でも表示されるようだが、16進数値文字が推奨されている。
ただし、以下の様な一定の規則がある。

  • セミコロンを削除
  • #とxは削除するか0に変換
  • &を¥に変換する

使いようによっては非常に便利で、テキストにオススメアイコンやNew!アイコンをつけたり、ダウンロードリンクにexcelやPDFのアイコンをつけたり、印刷リンクにプリンターのアイコンをつけたり…。用途は様々。
ただし冒頭で話したとおりIE7以下は無視されるので、無くても意味は通じる程度の使い方が今の段階では無難である。

SNS

Share on facebook
Share on twitter
Share on linkedin
ホームページ制作 長野市 松本市

withコロナのWeb戦略

多くの企業が今やっている成果が期待できないWeb戦略 最近、弊社ホームページのお問合せフォームや見積もりフォームからWeb関連企業がジョイントビジネスを求めてくるケースが目立ちます。弊社のお問い合わせフォームには、営業専

ブログを読む »
CMS

SEO対策の間違った考え方を正そう!

Web 制作をするときビックキーワードでは、ビジネスの成果にはつながらない 「顧客の抱え方問題点・課題点はなにか?」この部分がとても重要になります。つまり、ターゲットを絞り込んでペルソナを設定して、自社のビジネスに繋がる

ブログを読む »
倉島事業開発様

ショッピングパーク事業ホームページ制作

倉島事業開発株式会社様 青木島ショッピングパークホームページ 長野市ツルヤ青木島店のある青木島ショッピングパークのホームページ制作を行いました。倉島事業開発様が運営しているショッピングセーターなので、現在はコーポレートサ

ブログを読む »

HubSpotのすべて

ダウンロード