サイト構築 -CSS

[CSS]YouTubeなどの動画をレスポンシブ対応で実装する現在主流とこれからのテクニック

Post on:2017年5月19日

動画は拡大縮小が簡単な画像とは異なり、アスペクト比を維持したままレスポンシブ対応で埋め込むと、幅のサイズだけが変わり、高さがそのままになってしまいます。 この問題を解決するには、動画を配置するiframeをdivなどの親

...記事の続きを読む

[CSS]レイアウトでテキストは幅一定で、画像だけ幅いっぱいに表示させるスタイルシートのテクニック

Post on:2017年5月17日

テキストはスマホでは両横にマージンを保持しつつ幅いっぱいに、デスクトップでは指定した幅で表示し、常に画像だけ幅いっぱいに表示させるレイアウトを実装するスタイルシートのテクニックを紹介します。 floatやflexboxだ

...記事の続きを読む

さまざまなデザインのボタンを最小限のHTMLで実装する、HTML5とCSS3のテクニックのまとめ

Post on:2017年5月16日

HTMLはシンプルに最小限、26種類のさまざまなデザインのボタンを実装されたコレクションを紹介します。 ボタンのスタイルはSASSを使用してコンポーネントベース生成されており、さまざまなボタンのデザインをモジュール式で簡

...記事の続きを読む

2017年にチェックしておきたい、CSSの軽量フレームワークのまとめ

Post on:2017年4月27日

Flexboxで実装されたグリッドのみをはじめ、さまざまなコンポーネントが利用できるもの、ファイルがモジュール化されたもの、アクセシブルに特化されたものなど、2017年にチェックしておきたいCSSの軽量フレームワークを紹

...記事の続きを読む

CSS Grid Layoutの実装で必要な基礎知識、主要なプロパティと用語をくわしく解説

Post on:2017年4月14日

CSS Grid Layoutでは、多くの新しいコンセプトが導入されています。新しいプロパティは17個、新しい用語も数多くあります。これらは今まで使ってきたものとは大きく異なるため、CSS Grid Layoutを始める

...記事の続きを読む

CSSアニメーションは確実に進化している!キーフレームを使ったCSSアニメーションの実装ポイントまとめ

Post on:2017年4月11日

CSSアニメーションは確実に進化しています。 ユーザーを楽しませるだけでなく、ユーザーの注意をつかみ、サイトのゴールに導くための重要な手段にもなります。 単調なアニメーションではなく、キーフレームを使い、タイミング・ディ

...記事の続きを読む

CSS Grid Layoutに触れてみよう! CSS Grid Layoutのテンプレート定義を簡単に作成できるジェネレーター

Post on:2017年4月3日

Webページをレイアウトする際にfloatを使って、そして去年あたりからはflexboxを使っての実装が増えてきたと思います。 CSS Grid Layoutはようやくすべてのデスクトップブラウザでサポートされたばかりで

...記事の続きを読む

[CSS]Chromeの新バージョンをサポートしたNormalize.css v6.0.0がリリース、いくつかの重要な変更点に注意

Post on:2017年3月30日

ブラウザごとに異なるHTMLの各要素のスタイルを消去(Reset)するのではなく、スタイルを正常化(Normalize)するNormalize.cssが、2017年3月26日にアップデートされました。 2016年10月3

...記事の続きを読む

CSS Grid Layoutを使う前に知っておきたい、floatやflexboxなど既存の実装にどのような影響を与えるか

Post on:2017年3月29日

CSS Grid Layoutは先日リリースされたChrome 57がサポートし、デスクトップ用のすべてのブラウザで利用できるようになりました。 floatやflexbox、vertical-alignやinline-b

...記事の続きを読む

[CSS]デスクトップ・スマホ対応、浮かんだり光ったりアニメーションするボタンを簡単に実装できるスタイルシート

Post on:2017年3月28日

外部ファイルを一つ加えるだけで、さまざまなボタンを簡単に実装できるスタイルシートを紹介します。 鋭角や角丸の矩形、楕円形、ハンバーガーメニューに使われる円形、グラデーションやフラット、ゼリーみたいなボタンもあります。 B

...記事の続きを読む

 Prev 1 2 3 4 5 ... 86 87 Next

top of page

©2017 coliss