2019.07.29ToshiCSSの擬似要素(::before,::after)ってなんのために使うんだろう?そう思ったことはありませんか?今回は、そんな擬似要素の::beforeと::afterについて解説していきます。さんから引用させていただきました。CSSの::afterと::beforeは、疑似要素と呼ばれるものの1つです。これを使うと「HTMLには書かれていない要素もどきをCSSで作ることができる」のです。afterやbeforeがものすごく便利なのは「HTMLコードを汚すことなく様々な表現ができる」ということです。検索エンジンはCSSである疑似要素をコンテンツの中身として見ていません。そのため、SEOを気にせずにユーザーのための自由な表現ができるのです。出典元:サルワカこの文からもっと説明すると、HTMLを書かずにCSSによってHTMLタグの前後に要素を追加できる!って感じですかね。skyblue;}:nth-child(n番目)2番目の文字だけ色が変わるように:nth-child(2)にしている下の文字はリストで作成しているが・を表示したくない場合は、list-style:none;を指定すると・がなくなる。skyblue;}::first-letter最初の文字だけ色をつける.fl::first-letter{color:skyblue;font-size:2em;}::first-line1行目の色が<br>変わっていることがわかります。↑クリック後、他のところをクリックすると色が元に戻る。使用しbuttonに動きをつけてみました。使い方CSSはHTMLの装飾をするだけではなく、JavaScriptのような動きをつけることもできます。紹介したいと思います。www.alloneslife-0to1work.jp2019.07.30また、focusについて詳しくは書いていませんが目次を作りたい!jsを使わず、項目にfocusさせる方法。目次を作りたい!jsを使わず、項目にfocusさせる方法。javascriptを使わずfocusさせる方法www.alloneslife-0to1work.jp2018.07.31この記事で少しふれています。:existと:disabledについてinputタグにexistかdisabledを入れることにより、inputタグを有効また無効に設定することができます。placeholderを使うことにより、input内に文字を最初から入れることが可能となります。disabled>を入れています。::afterの使い方は覚えておきたいところです。jQueryを使い要素を追加してみたいと思います。使い要素の追加を行なっています。まとめToshiいかがでしたか?よく使っているものからあまり使っていなかったもの等あったかと思います!便利だと思ったものだけまとめているので、ぜひ参考に使ってみてください。ToshikazuNagasaki→Tokyo→China→Tokyo→Fukuoka1992/07/02宮崎産まれ、長崎育ち。Life関連記事CSS【コピペで使える】CSSの見出し(タイトル)記事をより見やすくしたいですよね?今回は、CSSで見出しを整えてみましょうといった内容です!見出しを整えることで、ユーザー(読者)が記事を読みやすくなります。使い方CSSはHTMLの装飾をするだけではなく、JavaScriptのような動きをつけることもできます。紹介したいと思います。今回は、CSSで文字を縦書きにする方法について説明します。文字を縦書きにしても良いんじゃないでしょうか?では、早速解説します!HTML目次を作りたい!jsを使わず、項目にfocusさせる方法。小学生からわかるプログラミング、ということで今回から「Progate」というプログラミング学習サイトを利用して一緒に勉強していきましょう。基礎の「HTMLとCSS」について学んでいきましょう!これを学ぶとWebページが作れます!CSSドットインストールで学ぶ、CSS入門(全17回)まとめ!【徹底解説】ドットインストールのCSS入門(全17回)の講座内容のポイントをまとめてみました。これは前回作っていたプロフィールサイトの続きです。コメントをキャンセルメールアドレスが公開されることはありません。※サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。ΔホームCODECSSToshikazuNagasaki→Tokyo→China→Tokyo→Fukuoka1992/07/02宮崎産まれ、長崎育ち。卒業し、美容師として4年から働いた後、IT系のベンチャー企業でプログラマーとして1年働く。その後、中国に移住し中国語やECサイトの運営方法などを学び帰国。現在は、再度プログラマーとしてSES事業を中心としている会社に勤務している。このサイトについて「AllOne'sLife」では、プログラミングについての記事~ブログ運営するうえで役立つノウハウ、YouTubeをやっていくうえで役立つ画像編集や動画編集のノウハウ、使ってよかった商品の紹介など様々な情報を発信しています。メニューHOMECODEWordPressPhotoshop副業(UberEats)商品紹介お問い合わせホーム検索トップサイドバーテキストのコピーはできません。defined.")}))})();。