タグ

@myENとCSSに関するyoshi-naのブックマーク (9)

  • [CSS]さりげなく、美しくて分かりやすいテーブルにするCSS3のチュートリアル

    IE6などの非サポートブラウザも配慮した、角丸、ゼブラ柄、ハイライトなど美しくて分かりやすいテーブルを実装するCSS3のチュートリアルを紹介します。 デモページ:Zebra stripes, footer 角丸、セルを交互にカラーリング 実装のポイント CSS3を使って美しく、そして機能するテーブルを実装するポイントです。 画像を使用しないで、角丸を実装。 余分なid, classは使用せず、更新が容易。 ※tableにclassを一つだけ ユーザフレンドリーで、読むことが簡単。 実装 HTML HTMLは非常にシンプルです。 classは、tableタグにのみ使用します。 <table class="bordered"> <thead> <tr> <th>#</th> <th>IMDB Top 10 Movies</th> <th>Year</th> </tr> </thead> <tr

  • 著作権放棄・シンプル・軽量で、iPhoneなどにもレイアウトを調整できるレスポンシブWebデザイン対応のHTML5フレームワーク・Fluid Baseline Grid - かちびと.net

    なかなか凄いフレームワークがあったので 反射的にメモ。パブリックドメインという のが何より太っ腹ですねー。自由に使用で きて、シンプルで汎用的、しかも軽量で iPhoneiPadにもレイアウトを自動調整 するレスポンシブWebデザイン対応のHTML5 フレームワークです。 これ、凄く良い感じです。いいもの全部詰め込んだ、みたいなソフトウェアですね・・・ちゃんと使いこなせるようになりたいかも。 Media Queriesを使ったレスポンシブWebデザイン対応のCSSフレームワークです。3カラム構成で組めるようにもしてあります。マークアップはHTML5+CSS3ですが、jsを使ってIEにも対応してくれています。 以下にざっと特徴を。 著作権放棄(パブリックドメイン) 軽量(CSSは9kb) ベースライングリッドに揃済み グリッドレイアウト対応 iPhoneiPadなどにも自動でレイアウトを

    著作権放棄・シンプル・軽量で、iPhoneなどにもレイアウトを調整できるレスポンシブWebデザイン対応のHTML5フレームワーク・Fluid Baseline Grid - かちびと.net
  • Web標準化Tips - Web標準普及プロジェクト

    特定のWebブラウザの独自拡張仕様を使っていたり、 特定のWebブラウザの表示が間違っていたために、 Mozillaによって実際に問題が発生した事例の修正方法を紹介しています。 また、ここで紹介する修正案は全てWeb標準仕様に基づいた内容となっています。

  • CSSバグリスト

    2020.05.23 Sat【保存版】ラッキーニッキーで3年遊んでわかった全て! Uncategorized 2020.05.23 Sat【保存版】ラッキーニッキーのライブカジノでおすすめを厳選! Uncategorized 2020.05.23 Sat【必見】ラッキーニッキーのボーナス情報を網羅!登録時や入金でお得! Uncategorized 2020.05.23 Sat【完全版】ラッキーニッキーのスロットおすすめランキング Uncategorized 2020.05.23 Satラッキーニッキーのサポート情報!エラー発生時はどうする? Uncategorized 2020.05.23 Sat【必見】ラッキーニッキーのVIP制度!ハイローラー向け Uncategorized 2020.05.23 Sat【保存版】ラッキーニッキーの入金・出金や限度額を解説! Uncategorized

    CSSバグリスト
  • Web制作者は知っておきたいwebサイトのレイアウト7選 │ Design Spice

    レスポンシブwebデザインからグリッドデザインまでよく使われているwebデザインのレイアウト用語をまとめました。 レスポンシブwebデザイン エラスティックレイアウト リキッドレイアウト フレキシブルレイアウト 固定幅レイアウト グリッドレイアウト 可変グリッドレイアウト レスポンシブwebデザイン(Responsive Web Design) PCやスマートフォン、タブレット事に複数のデザインを制作するのではなく、 ディスプレイの幅に合わせてデザインを最適化する方法。 CSS3のMedia Queriesを利用してディスプレイサイズに応じてデザインを変更します。 メリット 一つのソースで複数デバイスに対応できるのでメンテナンスが容易です。 また今後デバイスの種類が増えてもそれに対応できます。 それぞれのデバイスに合わせた形で調整できるのでユーザーエクスペリエンスも高くなります。 デメリッ

    Web制作者は知っておきたいwebサイトのレイアウト7選 │ Design Spice
  • 地味に使えるCSS小技のメモ&サンプル集 - かちびと.net

    この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 cssの小技的なテクニックが便利なので好きなん ですが、cssそのものが嫌いで覚えられないので カンペ的な記事を作ることにしました。便利な小技 は沢山あるんですが、特に自分が良く使いそうな Tipsをメモします。既に出回っている情報ばかりで 特に目新しい手法はありませんので何も期待でき ないです。 というわけで特にテーマも一貫性も無くて、ただ便利ってだけです。推奨されない方法もあるかもしれませんが、僕は細かいこと気にしませんのでそんな感じです。 内容も既出なのでお詳しい方にはお役に立てないですが、僕の個人的なメモなので適当に流して頂けると幸いです。 floatで並べたリストのセンタリング Sample01 コード .centered { position: rela

    地味に使えるCSS小技のメモ&サンプル集 - かちびと.net
  • 初心者の頃分からなかったWeb用語:フレームワーク … CSSからHTML5、WordPressまで

    Webを見ていると、フレームワークっていう言葉をよく目にします。初心者の頃は、このフレームワークっていうものがどんなものなのか、いまいち分かりませんでした。今回は、色んな例でフレームワークというものを紹介してみました。なので、フレームワークって何だろうっていう人向けの記事です! Web制作関連のブログを読んでいると、ときどきフレームワークっていう言葉がでてきます。例えば CSSのフレームワークとか、HTML5 + CSS3 のフレームワークとか …。 今でこそ、このフレームワークって何だかわかりますが、初心者の頃は、このフレームワークっていう言葉が何だか難しそうで、意味の分からないものでした(私だけ?)。何となく雰囲気で、使ってみると便利なのかなーという感じはしましたけど、そもそもフレームワークという言葉自体の意味が分かっていなかった頃は、使ってみよう!というところまで行きませんでした。

  • 少しのコードで実装可能な20のCSS小技集

    少しのコードで実装可能な20のCSS小技集CSSハックに続き、このCSS小技集も私のブックマークにずらりと並んでいたので、整理も兼ねて記事にしてみました。CSSのお勉強を始めたばかりの頃にブックマークしておいたものも多数。。ということで初心者さんからベテランさんまで参考にしてみてください! コードはサンプル内の「HTML」や「CSS」タブをクリックしてくださいね! 少しのコードで実装可能な CSS 小技集 シリーズ【第 2 弾】少しのコードで実装可能な 20 の CSS 小技集【第 3 弾】少しのコードで実装可能な 15 の CSS 小技集まずは CSS 基礎編1. div を中央揃えにするほとんどのサイトが基準となる div を画面の中央揃えに設定しています。左右の margin を auto にして中央揃えに。 3. 複数のクラスを指定実はクラスは一度に複数指定できます。スペースを空け

    少しのコードで実装可能な20のCSS小技集
  • http://cssglobe.com/post/9641/drawing-calendar-icon-with-css3

    yoshi-na
    yoshi-na 2011/02/14
    CSSだけでカレンダーアイコン作成するCSS変態テクニック。やってみたけど、活用の場がない、いまんとこ。
  • 1