タグ

cssとframeworkに関するsbg3のブックマーク (12)

  • CSS書きたくなさすぎ問題2017 - DRYな備忘録

    css書きたくない。できればjsも書きたくない。js必要なの嫌。軽くやりたい。という個人の日記です。 参考 Best CSS Frameworks of 2017 | Three29 10 Free Lightweight CSS Frameworks for a Fast Start 2017年にチェックしておきたい、CSSの軽量フレームワークのまとめ | コリス ググれ。 lightweight css framework - Google 検索 Gridだけやりたいやつは除外した。 Bootstrap Materialize mui (追記)UIkit (追記)Semantic UI Pure Bulma Skelton Spectre.css Kube Vuetify Fictoan avalanche Beuter Vanilla Milligram InvisCSS Look

    CSS書きたくなさすぎ問題2017 - DRYな備忘録
  • Outline – シンプルでクリーンなCSS3フレームワーク

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 最近はCSSフレームワークが多彩に出てきていて目移りしてしまいます。ついつい一番流行っているものを選んでしまいそうですが、当は目的に合わせて最適なものを選ぶのが良いでしょう。 今回はシンプル、クリーンなレスポンシブフレームワークというのがウリのOutlineを紹介します。デザインも整っていて格好良いです。 Outlineの使い方 ではスクリーンショット多めで紹介します。まずはカラーリング。フレッシュな色合いですね。 タイポグラフィ。 水平線と引用。 各種ボタン。 コード。YouTUbeなども埋め込みも想定されています。 Googleマップの埋め込み。 フォーム。 リスト。 メディア。右寄せもできます。 ページネーションとテーブル。 テーブルも幾つかのパターンが用意されています。

    Outline – シンプルでクリーンなCSS3フレームワーク
  • Gumby - Bootstrapの強力なライバルになるか!?シンプルかつ強力なCSS3フレームワーク MOONGIFT

    CSS3フレームワークは数多くなってきたのでその特徴をちゃんと掴んでおかないといけないですね。 GumbyはSassを使ったCSS3フレームワークです。他のフレームワークと同じようにレスポンシブ、モバイルフレンドリーになっています。その特徴を見ていきましょう。 まずデスクトップからです。 ヘッダーバー。フラットだったり、幅が固定だったりと色々な形式が想定されています。 タイポグラフィ。可読性高いです。 リストだけでも黒丸、白丸、ドット、数字など多数用意されています。さらに定義リストまで! ボタン。サイズ、色、形が様々です。片方だけ丸い、なんて便利そうですね。 インジケーターやラベル、アラート。こういうのもよく使いますよね。 フォーム。基的にplaceholderを使った表示になっているようです。 テーブル。角丸サポートです。 タブ。幅が設定できます。 縦のタブもあります。 ドロワー。クリ

    Gumby - Bootstrapの強力なライバルになるか!?シンプルかつ強力なCSS3フレームワーク MOONGIFT
  • Adobe製超軽量!!レスポンシブCSS フレームワークTopcoat

    Adobe製超軽量レスポンシブフレームワークTopcoat デザインしたくないシリーズ、第二弾!最近とっても気に入っているレスポンシブフレームワークTopcoatを紹介します。 Topcoatとは TopcoatはAdobe製のレスポンシブフレームワークで、最大の特徴がとにかくめっさ早い!ってこと。 jQueryMobileを使ってよくスマートフォンサイトを作っていたのですが、「いかにもjQuerymobile」感があったり、重い、デザイン上のカスタマイズがしずらいというものがありました。 ところがどっこい、Topcoatはとにかく軽く、さくさく。フレームワーク元のデザインも「今風」なフラットでシンプルなデザイン。 シンプルだから、後からカスタマイズも非常にしやすいのが特徴です。 流行りのフラットなデザイン ボタンやフォームの一つ一つがフラットで洗練されたデザインというのも特徴で、シンプル

  • レスポンシブ対応のフラットなUIフレームワーク·Furatto MOONGIFT

    FurattoはHTML5/JavaScript/CSS3製のオープンソース・ソフトウェア(Apache License 2.0)です。 最近流行のフラットデザインでサイトを作ってみたいと思いつつ、そのデザインフレームワークを使いこなすのが大変…と感じている方はFurattoを試してみましょう。BootstrapをベースにしたフラットUIデザインが実現できます。 ボタンデザイン。四角い、立体感のないデザインです。 カラーバリエーションも良くあるフラット系になっています。 ボタンにアイコンを載せることもできます。 画像。丸く表示もできます。 囲みをつけることもできます。囲みの色も変更可能です。 テーブル表示。こちらは通常のテーブルです。 ちょっと詰まった感じのテーブル。 行ごとの色変更も可能です。 レスポンシブなテーブルもありますが、幅をスマートフォンサイズまで縮めるとうまく表示できませんで

    レスポンシブ対応のフラットなUIフレームワーク·Furatto MOONGIFT
  • 著作権放棄のレスポンシブWebデザイン対応CSSフレームワーク・ingrid

    シンプルで良さそうだったのでメモ。 パブリックドメインのCSSフレームワ ークです。レスポンシブWebデザイン にも対応していますし、グリッドレイ アウトにも利用出来るのでなかなか 汎用性があるのでは無いかなと。 ライセンスはCC0(クリエイティブコモンズ版のパブリックドメイン)で、著作権は放棄されていますので、気軽に使えますね。 凄く特殊な性能をもったフレームワークという訳ではありませんが、個人的には余計な物が備わってない方がありがたいのでカスタマイズしやすいです。 グリッドレイアウトにも対応しています。 以下、サンプルです。 Sample css/* UNITS These divider classes are set on .ingrid container --------------------------------------------------------*/ .in

    著作権放棄のレスポンシブWebデザイン対応CSSフレームワーク・ingrid
  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
  • HTML5とCSS3を使いこなしたくなるフレームワーク15選

    HTML5とCSS3を使って作成されたフレームワークを紹介します。 「詳しくは」で各フレームワークがざっと分かる記事にリンクしています。

  • Online Inmate Search | Mugshots | Jails | Bluetrip Criminal Data

    Jail, Inmate, & Mugshot Data From Bluetrip Criminal Data AlabamaAlaskaArizonaArkansasCaliforniaColoradoConnecticutDelawareFloridaGeorgia

    Online Inmate Search | Mugshots | Jails | Bluetrip Criminal Data
  • CSSフレームワーク『BlueTrip』が想像以上にすごい - present

    CSS フレームワークを再認識 CSS フレームワークって、名前だけは知っていましたが、どういうものなのか全く知りませんでした。次の記事を読むまでは。 404 Not Found - ゆーすけべー日記 確かに、これは便利そうですね! さっそく、CSS フレームワークを導入してみます。 BlueTrip を導入 CSS フレームワークはいろいろありますが、今回は先の記事で紹介されていた BlueTrip を導入してみます。 次のページからアーカイブをダウンロードし、解凍して css ファイルと画像を static フォルダに配置。 BlueTrip CSS Framework | A beautiful and full-featured CSS framework HTML の head 部に、下記を追加。 <link rel="stylesheet" href="css/screen.c

    CSSフレームワーク『BlueTrip』が想像以上にすごい - present
  • ゆーすけべー日記

    サキとは彼女の自宅近く、湘南台駅前のスーパーマーケットで待ち合わせをした。彼女は自転車で後から追いつくと言い、僕は大きなコインパーキングへ車を停めた。煙草を一吸ってからスーパーマーケットへ向かうと、ひっきりなしに主婦的な女性かおばあちゃんが入り口を出たり入ったりしていた。時刻は午後5時になる。時計から目を上げると、待たせちゃったわねと大して悪びれてない様子でサキが手ぶらでやってきた。 お礼に料理を作るとはいえ、サキの家には材が十分足りていないらしく、こうしてスーパーマーケットに寄ることになった。サキは野菜コーナーから精肉コーナーまで、まるで優秀なカーナビに導かれるように無駄なく点検していった。欲しい材があると、2秒間程度それらを凝視し、一度手に取ったじゃがいもやら豚肉やらを迷うことなく僕が持っているカゴに放り込んだ。最後にアルコール飲料が冷やされている棚の前へ行くと、私が飲むからとチ

    ゆーすけべー日記
  • 先進的。HTML5/CSS3対応のデザインフレームワーク·52Framework MOONGIFT

    52FrameworkはHTML/JavaScript/CSS製のオープンソース・ソフトウェア。これまでのWebデザインが今後、大きく変わっていく可能性を秘めているのがHTML5やCSS3だ。まだ実験段階というイメージが強いが、GoogleやYoutubeをはじめとする大手サイトでも取り入れられ始めている。 Safari4での表示 最大シェアを持つIEの対応がいまいちなため、積極的に取り入れていくのは難しいと感じているかも知れない。しかし時代は進んでいる。ついにHTML5/CSS3をターゲットにしたデザインフレームワークが登場した。それが52frameworkだ。 52frameworkはHTML5でコーディングされ、CSS3を使った角丸やテキストの影、ボックスの影、グリッド表示、CSSリセットなどを行っている。グリッドはウィンドウを16のブロックに分割する。一つのブロックはフレームワーク

    先進的。HTML5/CSS3対応のデザインフレームワーク·52Framework MOONGIFT
  • 1