2018年10月2日(火)
【CSS】beforeとafterなど擬似要素の使い方
「擬似要素って、なんとなくとっつきづらい」
「擬似要素で表現できるものは、CSSに書けばよくない?」こんなイメージを「擬似要素」に持っていませんか? 特に、アイコン表示などは、CSSでも実現できるのに、なぜ擬似要素なの、という疑問はCSSを最初に学習し始めた人が素朴に抱きがちです。今回は、この疑問をお持ちの方に「擬似要素とは」を詳しく説明します。擬似要素はHTML要素に対して非常に意味があり、ぜひ使って欲しい使い方の一つなのです。この記事を読み終えたら、「ちょっと使ってみようかな」と思うように説明します。
この記事は、「擬似要素」に初めて触れる、あるいは、知っているけどよく使い方がわからないという初学者向けの記事です。もう既にご存知の方は読み飛ばして頂いても構いません。
この記事の内容
擬似要素の使い方
擬似要素を使った事例
擬似要素(pseudo-element)とは、「要素に似た要素」で、厳密には...
author:
creive(クリーブ)
クリエイティブを、アーカイブする。creive(クリーブ)は「クリエイティブ」をテーマに、デザインや制作、ライフハック等の情報を発信しているメディアです。
‹ PREV
カオス化したスタイルシートから卒業!CSSでカラーを管理する効率的な方法
NEXT ›
[ユーザー投稿] 企業のSEO/Webマーケティングを支援するFaber Companyが関西支社を2018年10月1日に開設
関連記事
Ads
クリエイティブを、アーカイブする。creive(クリーブ)は「クリエイティブ」をテーマに、デザインや制作、ライフハック等の情報を発信しているメディアです。creive(クリーブ)の記事『【CSS】beforeとafterなど擬似要素の使い方』についてまとめています。
この記事は特にCSS3・アイコン・SEO・Google・LINEについて書かれており、 気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のcreive(クリーブ)で全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとcreive(クリーブ)の記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。
Ads