タグ

CSSとtipsに関するsupiのブックマーク (3)

  • Shiny Knob Control with jQuery and CSS3

    In this tutorial we will be writing a jQuery plugin for creating a shiny knob control. Aptly named knobKnob, this plugin will use CSS3 transformations and jQuery's new event handling methods to give visitors of your website a new way of interactively choosing a value from a range. KnobKnob is also on Github. Update: Thanks to ranyefet the plugin now works on mobile devices [changes]. The HTML The

    Shiny Knob Control with jQuery and CSS3
  • overflowを使ってfloatの問題を解決するスタイルシートのテクニック | コリス

    フロートした子要素を内包するコンテナが高さを拡張しない問題を解決するためのテクニックはさまざまなものがあります。 その中から、overflowを使った方法とその際に生じる問題点とその解決方法を紹介します。 CSS: Clearing Floats with Overflow [ad#ad-2] 下記は各ポイントを意訳したものです。 はじめに Demo 1: overflow:auto; Demo 2: overflow:hidden; overflowを使って生じる問題点と解決方法 はじめに フロートベースのレイアウトをする際、ラッパーとなるコンテナがフロートしている子要素に対して高さを拡張しないことは、普通によくある問題です。 デモ:1 フロートをクリアする要素を配置して解消した例 しかし、この問題を解決するために、「overflow」プロパティでもできることを知っていましたか? これは

    supi
    supi 2011/03/11
  • iPad向け3つのCSS Tips - aduca

    iPadを相手にする。と考えれば案外いろいろな制約を考えずに済む。CSSを書くときに一番面倒なのは複数のブラウザを相手にすることだからだ。(viewportとかいう実に厄介な概念がなければよりよい) んでそんな時に心に留めておくとそこそこ便利tips nth-childとか使える :nth-child(even)とかすれば、偶数・奇数でわざわざ邪魔なクラスを付与する必要が無くなる。実によい。 今時の携帯回線網がどれだけ速いのかもよく知らないのであれだけど、とりあえず昔携帯サイトとか覚えてた頃は転送量に気を使いまくって、無駄な空白の一切を削除とかしていたので、無駄なクラス名が増えるのは悪いことではなかろう。 その他、CSS3とかのオプションは案外使えるので、がんがん使うとよい。 -webkitを付けないとダメなプロパティがいくつかある border-radiusとか、最近webkitブラウザ

  • 1