CSS2KB をちょっと改良 + CSSファイル に Canvas の描画ルーチンを埋め込む - latest log
CSSにデータを埋め込む方法を考えてみた(CSS2KB) - latest log の続き CSS2KB とは CSS にちょっとした情報を埋め込むトリックの1つ。 list-style: url(1dot.gif?key=val) から key=val を取り出せるというもの。 CSS2KB の難点は、ダミーファイル(1dot.gif) が実際に必要だった点 ダミーファイルのロード ⇒ 通信が余計に発生するよね ダミーファイルが 404 だと? ⇒ key=val が取り出せない ⇒ それってまずいよね ダミーファイルが邪魔なので、もうちょっと考えてみた 試しに、URL を list-style: url(?key=val) だけにしてみたら ダミーファイル(1dot.gif)が不要に CSS のファイルパスが補完された形で取得できる ⇒ 補完された CSS のURLがついでに取れてくる
Webfactory : Weblog : dl,dt,ddでシンプルな横並びを表現する
以前書いていたエントリーなのですがバックアップを取っておらず、データの移行が難しいので少しずつ昔のデータを編集しながら再エントリーしていきたいと思います。CSSの記述にも昔のエントリーを見ると間違えている部分が多いので修正できるチャンスでもあるわけです。というわけで過去に書いたdl,dt,ddで綺横並びを再エントリー。 基本といえば基本の定義リストである「dl,dt,dd」を利用しての単純なリストを作ってみます。 <dl class="list"> <dt>名前</dt> <dd>ヤマナカヅオ</dd> <dt>性別</dt> <dd>男性</dd> <dt>年齢</dt> <dd>52歳</dd> <dt>趣味</dt> <dd>カメラとネットサーフィン以外特に・・・</dd> </dl> dl.list { border-top: 1px solid #ccc; line-height
CSS Nite in Ginza, Vol.23のまとめ | Blog hamashun.com
追記 2008-04-03 言及を頂いたので質問コーナーに追記しました CSS Nite in Ginza, Vol.23に行ってきました。 今回のゲストはあの大藤幹さん。 大藤さんの名著CSSプロフェッショナル・スタイルは、コーディングの勉強を始めたばっかりの頃に買って物凄く役に立った本だった事もあって、かなり期待していました。 開演前 19時開演なので18時30分に到着したんですが、既に座席は満員でした。 さすがに凄い人気です。 テーマ 大藤さんは雑誌Web Designingに『CSS Analysis』という連載をしていて、その内容は世界のWebサイトを取りあげて色んなテクニックを紹介するという物。 今回のテーマはそれの特別版みたいな感じで、『CSS Analysis Live!』でした。 なお、内容はあくまで解析したサイトの結果であり、それが正しいとか、或いは大藤さんの意見である
jQuery を高速に使う CSS セレクタの書き方 - てっく煮ブログ
JavaScriptjQuery は CSS セレクタで要素を選んで処理できるのが魅力的ですね。そんな jQuery ですが、CSS セレクタの書き方次第で速度が大幅に変わってきます。ここでは jQuery の内部処理を疑似コードで示しつつ、jQuery を高速に使うためのポイントを５つに絞って紹介します。何度も同じセレクタを実行しないクラスだけを指定するのは禁止#id を積極的に使う途中までの結果を再利用する子供セレクタ(>)を使うと速くなることがある※ この記事は jQuery 1.2.6 のソースコードを元に記述しています1. 何度も同じセレクタを実行しない改善前 // 例題 1 $("div.foo").addClass("bar"); $("div.foo").css("background", "#ffffff"); $("div.foo").click(function(){
段組みを実現するCSSレイアウトをオープンソースで·Typogridphy MOONGIFT
プログラマーやSEの方々はWebデザインが苦手だ。私自身、色々勉強はしつつもどうにも好きにはなれない。そのため、極力テンプレート的なものを使って作業するようにしている。デザインを後回しにすると、システムがある程度できた時にはじめることになり、折角乗っている気分を台無しにする恐れがある。 CSSで段組みを実現 最近の流行は960px幅のWebサイトらしい。その大きさに基づいて、印刷レベルでも耐えうるというのがTypogridphyだ。 TypogridphyはCSSテンプレートをオープンソースで公開している（ライセンスは明記されていなかったのでご注意いただきたい）。XHTMLに準拠し、ValidなCSSとなっている。 TypogridphyはPHPファイルと一緒に提供されているが、プログラミングコード部分がないのでHTMLと変わらないようだ。960pxと書かれているが、デモ用のHTMLファイ
ブラウザだけでCSSレイアウトに対応したページをさくさく作ることができる『Drawter』 | 100SHIKI
CSSとHTMLの知識は必須だが、慣れている人には超絶便利そうなツールのご紹介。 Drawterはブラウザ上でDOM要素を配置、さまざまなカスタマイズを施したあとにコードを生成してくれるツールだ。 つまるところ、CSSレイアウトに対応したサイト製作ツールといってもいいだろう。 要素ごとにさまざまな属性を直感的に追加していける点が素晴らしい。インターフェースもシンプルで職人ぽいので個人的に好みである。日本語も入力可能だ。 当然ながら作り終えたあとは「Generate Code」コマンドでコードを生成、そのまま使うことができる。 似たようなツールはすでにいくつかあるが、Drawterの完成度はかなり高いのではないだろうか。是非試してみてもらいたい。
サイト制作のためのテンプレートをごっそり自動生成してくれる『Project deply*』 | IDEA*IDEA
ドットインストール代表のライフハックブログ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[CSS]ボタンやナビゲーションを実装するスタイルシートのチュートリアル集
[CSS]左右で色が異なる背景画像を設定するスタイルシート
[CSS]クロスブラウザ対応のフリーのナビゲーション集 -Styled Menu