タグ

cssと1712に関するsometkのブックマーク (2)

  • 5分で完璧に分かる!CSS Gridの基本的な使い方を解説

    CSS Gridは、今まで使用してきたレイアウトの実装とは大きく異なります。flexboxはアイテムを一つの軸に沿って並べるので、floatの延長としてあまり難しくはないと思います。しかし、CSS Gridは軸が一つではなく、縦と横の二つの軸でレイアウトします。 CSS Gridの基的な使い方を分かりやすく解説します。 Learn CSS Grid in 5 Minutes by Per Harald Borgen 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 CSS Gridを始めよう! 最初のグリッドレイアウト CSS Gridの列と行 CSS Gridのアイテムの配置 CSS Gridを始めよう! グリッドレイアウトはWebサイトの設計において基であり、CSS Grid モジュールはグリッドを作成するための最も強力で

    5分で完璧に分かる!CSS Gridの基本的な使い方を解説
    sometk
    sometk 2017/12/19
    gridの記事いつも思うんだけど、サンプルについて、ビフォアーはともかくアフターが現実的でなくて、使いどころがわからないんだよね‥レスポンシブで2x3や3x2、畳の配置とか案件でやる機会ないし。
  • HTMLメール用のCSSリセットとテンプレート、主要なメールクライアントのバグにも対応 -normalize.email.css

    WebブラウザがFlexboxやCSS Gridをサポートしていく中、HTMLメールではXHTMLとtableレイアウトがまだまだ主流です。 HTMLメールを作成する時のベースになる、HTMLのテンプレートと有用なデフォルトのスタイルを提供するCSSリセットを紹介します。 normalize.email.css -GitHub normalize.email.cssの特徴 normalize.email.cssの構成 HTMLメールを作成する時のテンプレート normalize.email.cssの中身 normalize.email.cssの特徴 ほとんどの電子メールクライアントに有用なデフォルトのスタイルを提供。 ネイティブプラットフォームのフォントスタイルを作成。 HTMLメールの一般的なバグに対応。 コメントを使用したスタイルの説明。 normalize.email.cssの構成

    HTMLメール用のCSSリセットとテンプレート、主要なメールクライアントのバグにも対応 -normalize.email.css
    sometk
    sometk 2017/12/06
    あれ?万能じゃないよね。外部cssが使えないというケースに幾度となく遭遇したような気が。
  • 1