CSS 【CSS】「border-radius」使い方メモ／角を丸くする
border-radius とは 要素の四隅の角を丸くするためのCSSプロパティーのことです。 背景も画像もこれで丸くすることができます。 使い方 同じ角度の丸み 半径10pxの角丸 border-radius: 10px; 四隅がそれぞれ...
CSS
CSS 
CSS 【CSS】Grid Layout
Grid Layout とは 格子状のマス目をベースとしてレイアウトを組むときに使うもの。 似ているもので「Flexbox」があります。 Flexbox との違い Flexboxは一方方向でのレイアウトに対して、Grid Layout は縦...
CSS 【CSS】「display」 の使い方／要素の表示形式
display とは CSSのプロパティの一つで、要素の表示形式を決めるものです。 わかりやすい画像をお借りしました。（サルカワさんのサイト） それぞれの意味と使い方 display: block ブロックの前後には空白、縦に並ぶのが特徴 ...
CSS 【CSS】「:target」 使い方メモ／アンカーリンク先の表示
:target とは :target疑似クラスは、ターゲットとなるアンカーリンク先の要素を表します。 アンカーリンクは、同じページにある項目や、別のページにうつるものです。 「URLのフラグメント」 URLの「」のように、URLの最後につく...
CSS 【CSS】「counter-increment」使い方メモ／番号を付ける
counter-increment とは 複数ある要素に番号を付けたいときに使用します。 様よりお借りしました 使い方 疑似要素に「content: counter();」も指定します。 文章の先頭に数字を入れたいとき、 li { coun...
CSS 【リセットCSS】概要とNormalize.cssの使い方
リセットCSSとは 「Google Chrome」「Safari」「Microsoft Edge」など、それぞれ異なるブラウザでもすべて同じように、サイトが表示されるためのCSSのことです。 リセットCSSを使用するのは一般的になっています...
CSS 【WordPress】モバイルボタンの表示が遅い！苦戦！！
私は、Wordpress のテーマ「cocoon」を使用しています。 スキンの変更や、モバイルボタンの変更をしていたら、モバイルボタンの表示が遅いことに気が付きました。 2秒程度待つと出てくるか、スクロールをすると出てくるようになっています...
CSS 【CSS】アニメーションを付けられる「transition」の意味、使い方
transitionについて学習します。 transitionとは 「transition」は、ページにCSSでアニメーションをつけることができます。 「transition-duration:3s」は、3秒かけて表示していくアニメーション...
CSS トップページ（固定ページ）のタイトルがどうしても消えない
私は、Wordpressテーマ「cocoon」を使用しています。 トップページを固定ページにしている場合、タイトルをCSSで簡単に消すことができます。 固定ページ編集画面の「カスタムCSS」に記述する場合 h1 { display: non...
CSS CSSが反映しない！CSSの読み込み優先順位
CSSについて学習中なのですが、記述したCSSが反映されないことがありました。 CSSを記述する際には優先順位について理解しておく必要があります。 CSSについて簡単に振り返り CSSはスタイルシートとよばれ、ページの装飾をするのに使用しま...