デザイン– tag –

WordPressや導入したテーマの設定で、ある程度ブログデザインのカスタマイズはできますが 「この部分がもう少しこうだったらいいのに」とか「ここはちょっとデザインに凝りたい」と思うことはないでしょうか？ せっかく立ち上げた自分のブログ、少しでもデ...

CSSの「Flexbox」は「float」等に比べ、簡単に要素をレイアウト出来るモジュールです。もはやレイアウトを組む際の主流と言ってもいいのではないでしょうか。今回はFlexboxの書き方やプロパティと値の種類を見ていきたいと思います。 この記事はこんな方に...

「text-align」プロパティは、CSSではかなりの頻度で使われるプロパティではないでしょうか。そのため、どんな値があるのかを知っておくと何かと便利です。 そして、このプロパティは使われる機会が多い分「思ったように配置されない・・・」となることも...

CSSでテキスト等を上下中央に配置したい場面は多いかと思います。そんなとき出番となるのが「vertical-align」プロパティですが、「vertical-align: middle;」と指定しても上下中央にならないことがあります。 今回は、なぜvertical-alignが効かないのか？...

前回の記事ではCSSでz-indexを使う上でのポイントを解説しました。 そのときに、指定する値は整数にする必要があることを書きましたが、整数でもマイナスの値を指定したら要素が表示されなくなる場合があります。今回は、そんな時の対処法を解説します。 ⇒...

CSSを書いていると、要素を重ねたい場面が出てきます。そんなとき「z-index」プロパティを使えば要素の重なり順を操作することが可能です。 この記事では、使い方や効かないときの対処法など、z-indexを使う上でのポイントを解説します。 ⇒z-indexでマイナ...

CSSで要素の配置を決めたいときには「position」プロパティを使うと便利です。このプロパティはCSSでは使う機会も多いと思います。この記事では、それぞれの値がどんな動きになるのか見ていきたいと思います。 【要素の移動量を決める「top」「left」「bot...

CSSで背景画像の上にテキストを表示させて、それを画像の中心に持ってきたい場面って結構あるんですよね。ページのトップ画像にタイトルを載せたり、画像の説明のために必要だったり。 今回はそのやり方について解説します。 【画像とテキストのデフォルト...