CSS

背景に動画を使うための方法を紹介していきます。厳密には背景は画像しか指定できないので、「背景っぽく」CSSで表現するって感じですね。 この記事ではファーストビューの画面いっぱいに動画を表示させるための書き方を紹介していき […]

この記事ではCSSを理解するためのWebサービスとおすすめの書籍を紹介します。 基本的には手を動かして体験しまくって、自分の頭でイメージできるようになって身につくものだと思います。 CSSの基礎は無料Webサービスのドッ […]

レスポンシブサイトを主流になって、CSSでの表現で「%」と「em」がよく使われるようになりました。この2つの値は両方とも倍率を表すものです。 マスターするポイントとしては、「どこの値に対する倍率か？」を知ることだと思いま […]

「ブレークポイントをどうしよう…」、レスポンシブデザインでは常に悩みの種かもしれません。日頃コーダーとしてデザインカンプからPCデザインだけ渡されて「スマホもレスポンシブでいい感じによろしく！」的な指示を受け […]

CSSのテーブルは癖が強いというか、どういう風な仕組みで動いているか分かりにくいCSSにプロパティだと思います。 よくあるのは、レスポンシブ時にはみ出る、、、というやつですね。もともとテーブルとスマホは相性が悪いですが、 […]

縦書きのサイトを作るときのCSSの使い方と注意点についてまとめました。 癖が強いので、ブラウザ間での差異がないかのチェックは入念にしておいた方がいいかもしれません。 縦書きにするCSSの指定方法 以下のHTMLを縦書きに […]

CSSは基本的に変数は使えませんが、連番を表現するときは動的に順番の「値（数字）」を取得してくれる関数？値？が用意されています。 よくあるのは、ブログとかのランキングで「○位」みたいな指定をするときでしょうか。動的に順番 […]

Webサイトで表示させるフォントには大きく分けると2つあります。 デバイスフォント ・・・ WindowsやMacなどのデバイスに依存 Webフォント ・・・ ネットワーク上からフォントデータを取得 デバイスフォントとは […]

レスポンシブサイトでアイテムを横並びにする時のCSSの指定方法です。ウインドウサイズを変更したときに、ガタガタせずにスムーズに均等に縮めたりするには、CSSのcalc関数を使って余白を計算させながらパーセント指定すると、 […]

Sassは、CSSを拡張した言語で、利用する主な目的としては「CSSを管理しやすくするため」です。 平面にベターっと並ぶCSSはとてつもなく見づらく管理しずらい圧倒的なデメリットがあります。CSSが数千、数万行となったと […]