Flexboxについて勉強したい・理解を深めたいときに参考になるエントリーやサイトまとめ - NxWorld
特に自分がそのように思っていたのですが、Flexboxはレイアウトを組む際に非常に便利なものではあるのですが、非対応のブラウザをサポートする必要があるために安易に使用できなかったり、仕様がころころ変わって対応してたとしてもブラウザによって様々な書き方をする必要があったりで、本格的に使うのはまだしばらく先にとかもう少し様子を見ようと思ってた人も少なくないと思います。 ただ、最近では以前に比べて記述する内容も減り、対応していなかったブラウザもサポートを切る機会が多くなったりと今後ますます利用する場面が増えそうなので、先述したようにFlexboxについて勉強したい方やより理解を深めたいという時に参考になると思うエントリーやサイトをまとめてみました。 全体的に英語のエントリーなどが少し目立ちますが、Google翻訳などを使えば大体の内容は理解できると思います。 November 16, 2017
Bootstrap 3(2.xも)を活用する時に役立つリソースのまとめ
Bootstrapは先日リリースされたBootstrap 3rc1で、モバイルファーストのフロンドエンド用のフレームワークに生まれ変わりました。2.xまでは、デスクトップ用のブラウザを想定したインターフェイスのコンポーネントを核にしていました。 Bootstrapをカスタマイズしたり、もっと活用するためのリソースを紹介します。 まずは、本家のBootstrapから。 Bootstrap 3 スマフォやタブレットでの利用を優先したシンプルでパワフルなUIエレメントが揃ったフロントエンド用のフレームワーク。 最新のBootstrap 3rc1（7/27に公開）はリリース候補版です。 Examples Templates for Bootstrap Bootstrap純正のテンプレートやページの仕掛けが揃っています。 Narrow marketing 小さいプロジェクト用の軽量のテンプレート。
HTML5＋CSS3の「カンタン装飾設定」で今風デザイン
基本的にグラデーションや角丸はジェネレータからコピペして設定できるので、作業自体は簡単です。HTML5＋CSS3サンプルを使って表現してみましょう。 （1）装飾のキモは「グラデーション・線・角丸・影・テクスチャー」 前回HTML5＋CSS3の「レイアウトを自在に使いこなす」では、限られたいくつかのCSSプロパティを組み合わせて、さまざまなレイアウトができることをお見せしましたが、今回はそれに装飾を加えていきます。 いざ装飾しようとすると、どこから手を付ければ良いのか迷ってしまうかもしれませんが、アイコンなどの絵を除けば、装飾の要素は「グラデーション」「線」「角丸」「影」「テクスチャー」くらいなものです。それらを整理して組み合わせることで、全体として一体感のあるデザインに仕上げられます。 「それが難しいんだよ！」というお叱りの声が聞こえてきそうですが（笑）、以下の2つを見比べてみましょう。上
CSS(スタイルシート)の基本、小技、テクニック総まとめ
CSSの基本や使える小技テクニックなどを幅広くまとめました。以前書いて今もそこそこアクセスがある「CSSの知識をもっと深める30+2の小技テクニック集｜Webpark」という記事があるのですが、2年近く前の記事ですしパワーアップさせて作り直しました。 恐らく過去最長の記事ですので目次を作りました。クリックするとするりと移動します。基本的な内容が多いですが、お役に立つ項目があればうれしいです。 ということで順番に説明していきます。 1. 全般的なこと 1-1. CSSリセット ブラウザごとでデフォルトのスタイルは異なっています。その違いをそのままにしておくと、後でブラウザ間の表示の違いに悩むことになり、どこが原因か分からないとイライラしてしまいます。 そんなことのないように、いったんデフォルトのスタイルをリセットしてしまおうというのがリセットCSSです。 方法は色々ありますが、個人的には一番
web製作者向けチートシートまとめ - CHROMA
List Adobe関連 Illustrator Photoshop Fireworks Indesign Acrobat HTML,CSS HTML 文字実体参照 CSS HTML5+CSS3サポートブラウザ Canvas Haml,Sass Haml Sass Vim,Zencoding Vim Zencoding javascript/jQuery javascript jQuery UNIX 正規表現 検証ツール Firebug Chrome Developer Tool ブラウザ関連 Chrome Safari Firefox IE Mac 参考 アプリ・ツール Adobe関連(CS5-CS6) CS5と6のチートシート上げてるけど、adobe製品なら簡単にエクスポートできると思う。例えばfireworksなら、メニューバーから[Fireworks>ショートカット>現在のセット：
Youtubeの動画を背景に
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Css preprocessorの始めかた
[CSS]CSS3で何ができるの？ という時にみておきたいサイト集