Category : HTML&CSS

【CSS】CSSで変数使って楽をしよう

以前、CSSでカスタムプロパティが使えるようになっていたという記事を書いたのですが、IEが対応していないということはあるものの、試しに使ってみた結果、けっこう使...

【レイアウト】CSSを使ったwebレイアウト手法まとめ (3カラム編)

2カラムの場合のレイアウトのまとめをしたので、今回は、いわゆる聖杯レイアウトの3カラムのタイプです。 【今回のサンプル】3カラムのレイアウト いわゆる聖杯レ...

【レイアウト】CSSを使ったwebレイアウト手法まとめ (2カラム編)

webサイトのレイアウト手法にCSS Gridが追加されました。 対応状況の件もあるけれど、今まで以上にレイアウトの自由度が上がることもあって今後使うサイトが...

【SCSS】SCSS(SASS)で文字をエスケープしたい

前回のCSSグリッドのmixinを作っていた際に、はまったのが文字のエスケープ。 なぜはまったかといえば… [crayon-5a8d8cc1aa2741...

【CSSグリッド】CSS Grid Layout時代に合わせてmixinを作ってみる

2017年3月にモダンブラウザで一斉に対応されるようになった、CSS Grid Layout。 現在、実験&勉強中です。 学んでいる過程でどうもIEやE...

【webアイコン】Font AwesomeとMaterial icons、どっちがいい?

webサイト用のアイコン。 自分で作るという選択肢以外にも、既にあるものを利用するという手もあります。中でもFont Awesomeはwebフォントを使ったア...

【マテリアルデザイン】高度に合わせたbox-shadowを設定したclassを作る

Googleのマテリアルデザインは、フラットデザインに影がついてるだけと思われがちですが、厳密にたくさんのルールが存在しています。そのあたりはマテリアル...