タグ

cssに関するonkのブックマーク (54)

  • livedoor clip non-commented-user invisible

    onk
    onk 2007/06/18
    これはグッジョブ過ぎる!
  • miniturbo::Memo - 社内勉強会でCSSについて話しました

    日、社内勉強会でCSSのボックスについてお話してきました。 資料は以下からご覧ください。(Opera は F11を押してね) CSS:ボックスのおはなし 前日までネタが決まっていなかったので、自分自身でも曖昧な点が多かったです…次回はもっと検証する時間をもうけて徹底的に挙動を押さえてから挑みたいです。 Twitterで添削をしてくれた皆様、ありがとうございました :) Comments: 5 HEXANE 07-06-07 (Thu) 02:43 「Academic HTML」 http://www.tg.rim.or.jp/~hexane/ach/ と酷似した表現が散見されます。 特に,「コンパクトボックス」のくだりは, http://www.tg.rim.or.jp/~hexane/ach/lbcs/lbcs4-07.htm とまったく同じ表現がありますが,これはどうご説明なさいます

    onk
    onk 2007/06/07
    ボックスモデルの説明.
  • Make Thunderbird's Labels Stand Out | TwisterMc

    I’m a big fan of Thunderbrid, however one of the things that bugs me is that the labels don’t stand out enough. I feel as if they kind of blend into the background. I did a bit of research and figured out how to style the labels to stand out a bit more. Check it out: To update your labels in Thunderbird follow these simple steps. Install Stylish in Thunderbird – Go to https://addons.mozilla.org/en

    Make Thunderbird's Labels Stand Out | TwisterMc
    onk
    onk 2007/06/01
    Thunderbird 向けの ユーザスタイルシート.背景色で示される方が断然見やすいぜ!
  • フロートとネガティブマージンまとめ:CSS | Tech de Go

    onk
    onk 2007/05/23
    これは素晴らしい.float を使って段組する際の考慮点についてよくまとまっていて分かりやすい.図示は正義だな.
  • TRANS - 携帯用CSSを書く上で押さえておくべきポイント

    先日、diggでVitamin Features » Make your site mobile friendlyというエントリーが上がってきてました。見てみると、非常にうまい具合に携帯向けのCSSHTMLの書き方などが紹介されていました。僕も携帯向けCSSの書き方には興味があったので、勉強がてら重要なポイントを抜き出して、和訳してみました。 和訳文は次からスタートです。(上記サイトの「mobile」は携帯電話やPDAを含めたモバイル機器が正確な訳ですが、ここでは話を分かりやすくするために「mobile」を全て「携帯」と訳しています。) 基からスタートしよう。 既に論理的でセマンティックなHTMLを構造化しているんだったら、携帯を含めたどのデバイスでもきれいに、使いやすく、アクセシブルになっています。携帯によっては、WAPに準拠しているかもしれないし、もしかしたらWAP2もいけるかもし

    TRANS - 携帯用CSSを書く上で押さえておくべきポイント
    onk
    onk 2007/05/21
    携帯用 CSS.ダウンロード時間を考慮して軽量化すべし.
  • 改行 - odz buffer

    ページ幅を 760px 程度にしてサイドバーと文の 2 カラム構成ってサイトは結構多いと思う。 まぁ、そういうこと自体は別にいいんだけど、そういうサイトで改行を機械任せにせずにわざわざ人間が入れていたりする場合があって、閲覧者の環境(主に、ブラウザとフォント)が違うとえらく読みにくい場合があったりする。 具体的にはこんなかんじ。 うん、まぁ、Suffix Array を使って「任意部分文字列の頻度計数」 なんてことを やっていた自分にとっては、手元のコードを組み合わせて30行ほどの コードを 書け足せば、それなりの速度で動くものが出来上がるという状態だった りするんだけど、 いきなり回答を書いてしまうのもあれかと思うので、とりあえず さらすのはやめておく。繰り返し回数 k 回以上とか言う指定も可だっ たり。 なお Pentium M 2GHz で 30 MBytes ほどのテキストに対し

    改行 - odz buffer
    onk
    onk 2007/05/20
    コレやられるとホント読みづらい……. / 文単位で,句点で改行を入れるのは許せるようになってきた.
  • コーディングガイドライン

    構造と見た目の分離の必要性 HTML は Markup (意味付け)する Language (言語)です。例えば文脈のなかで、「ここは見出しですよ」「ここは段落ですよ」などという感じに「意味付け」を行い、文書構造を記述するための言語です。 ところが HTML は Web ページのレイアウト目的に使う仕様が多数盛り込まれ、その簡便さ、習得のしやすさと柔軟性から、来の「意味付け」以外のレイアウトや見栄えに関する要素が多く使われていました。 それでは来の HTML の目的に反するということで、「見た目」の部分を担当する CSS が策定されました。 建築物に置き換えるならば、きれいな骨組みの建物(HTML)に壁の色を塗ったり窓の形を変えたり(CSS)という感じでしょうか。いくらきれいな色を使っていても設計ミスの建物では使い物になりません。文書でも同じことが言えるもので、プレーンに理解しやすい文

    onk
    onk 2007/05/13
    ガイドラインの重要性.とにかく「一貫している」状態である必要がある.統一さえされていればあとでなんとでもなるもんね.
  • floatは「回り込み」ではない:てんぽ

    てんぽ: floatは「回り込み」ではない CSSHTML、FC2ブログのカスタマイズ、共有テンプレートなど 「CSSのfloatプロパティは『回り込み』させるものである」とよく説明されますが、それは特定条件下での表示結果がそのように見えるだけであって、あまり正確ではありません。 「回り込み」という表現はfloatを使いこなすうえで、語弊になっていると思います。 floatとは、通常の流れ(normal flow)から取り除き、左(または右)に寄せるです。 floatは「回り込み」ではない <p> <img src="xxx.jpg" alt="floating image"> 「回り込む」テキスト </p> このときimg要素を左にフロートさせた(float:left)なら、後続するテキストはimgの右側に「回り込み」ます。 これは確かに回り込みと呼べます。 では、ブロックレベル要素を

    onk
    onk 2007/05/11
    W3C の勧告は最低読んでおかなきゃねw / 「floatが難しいのは、制作者が正しい仕様を知らないか、IEのバグのせいです」
  • twitter.com/akogina

    Style with custom themes! Change the background, color, schemes, fonts, and more! Share your own themes too!

    twitter.com/akogina
    onk
    onk 2007/05/09
    ちょww
  • Buzzurl [バザール] / ソーシャルブックマーク

    onk
    onk 2007/05/06
    「新着エントリー」欄でブラウザの既読/未読でアイコンを分けているのに感動した!見やすいわー.
  • Gmail - display keyboard shortcuts

    Style with custom themes! Change the background, color, schemes, fonts, and more! Share your own themes too!

    Gmail - display keyboard shortcuts
    onk
    onk 2007/04/08
    目の端にキーボードショートカット置いておきたいよねー
  • 4chan Burichan Override

    onk
    onk 2007/03/27
    この Before の色遣いはあり得ないだろ,常識的に考えて…….
  • 俺がwikiを嫌う理由 | スパムとか

    まずはここを見てください。 文章の中に「レイヤモデルアーキテクチャ」という言葉があります。この言葉が何を意味しているのか、リンクをクリックすればわかるはずですよね? Fxck! ※ひがさんが悪いのではありませんので、あしからず。ひがさんのページで学んでいて、丁度いい例があったので使わせてもらっただけです。S2万歳! Taged with:technology, urihttp://www.everes.net/2007/mar/20/fuxking-wiki/ Entry Date:2007-03-20 13:45 Author:makoto ping url:http://www.everes.net/2007/mar/20/fuxking-wiki/tbping/ subscribe:feed with LDR

    onk
    onk 2007/03/27
    ユーザスタイルシートでマージン入れれば.
  • Google Search Form Cleanup

    onk
    onk 2007/03/26
    なんというシンプルなポータル画面.トップページを見ただけでワクワクしてしまった
  • ITmedia(itmedia.co.jp) clean up | userstyles.org

    Style with custom themes! Change the background, color, schemes, fonts, and more! Share your own themes too!

    ITmedia(itmedia.co.jp) clean up | userstyles.org
    onk
    onk 2007/03/15
    gj!
  • Firefox - Add-ons - reduce size

    Style with custom themes! Change the background, color, schemes, fonts, and more! Share your own themes too!

    Firefox - Add-ons - reduce size
    onk
    onk 2007/03/10
    すげぇ……(笑) 更に一覧性が高まったよ><
  • Tableless forms

    I consider this a very important step in learning web design the right and straightforward way. CSS is no longer just a way of adding some simple styles to an element in your page. More and more web designers work very much with styles in order to create a unique and easy to maintain website. You can see some inspirational examples by visiting a gallery like CSSREMIX or cssdrive. Those are CSS gal

    onk
    onk 2007/03/07
    テキストボックス内にアイコンを表示するのは良いアイディアだよなぁ.TMT Validator でも必須アイコン(*)を表示してたし.非常に分かりやすい.
  • Quote Colorer 2.5

    onk
    onk 2007/03/02
    やり過ぎ感が……(笑)
  • Zoom Layout

    2005-07-29T18:35:16+09:00 Axxlog » A hack for implementing zoom layouts(Axxlog) Zoom Layoutなるものを最近海外のWeb Developerなサイトでちらほらみかけるようになったのだけれど、いろいろ見てるとどうやらアクセシビリティスタイルな機能(ズーム機能や各種ユーザースタイルシートの選択機能など)の無いUAでもアクセシビリティーを考慮してデカ字でハイコントラストなコンテンツを提供するCSSを用意しようぜ!的ノリっぽい。加えてlink要素にrev="zoom"なんて具合にアトリビュートを指定してmicroformatsっぽい。 先日とある人からWebブラウズに関するお話を伺った時に一番印象に残っているのは私はいつもインターネットの文字を最大にしている。それでもみにくい時はそこには欲しい情報がなかったんだ

    onk
    onk 2007/02/24
    Zoom Layout のススメ.そういうこと考える人はユーザスタイルシートで何とかすれば良いんじゃないかと思わないでもないけど(笑) サイト運営側の準備が大変だよ…….
  • miniturbo::Blog CSS勉強会にいってきました

    amachangさん主催の、「新春 CSS 隠し芸大会」にスピーカとして参加してきました。ここ連日、プレゼン用の資料制作に追われていたのですが、なかなか終わらず...。できたのはプレゼン当日の朝でした(徹夜明け)。 以下に、資料を公開します。 Wii +CSS = WSS? (Wii と CSS) 僕は、巷で話題のWiiとCSSを合わせたネタを披露しました。「とにかく、Wii実機では解像度の関係でコンテンツが見づらい。それなら、より快適なブラウジングのために、Wii用のスタイルを作ろう」...といったコンセプトになっています。(時間がなくて、肝心のWii用のスタイルができなかったのですが...) まぁ、無事に終わってホッとしました。他のスピーカの方々、ご静聴いただいた皆様、お疲れ様でした! ちなみに、資料はW3CのHTMLプレゼンテーションツール「HTML Slidy」を使用しました。実際

    onk
    onk 2007/02/24
    あとで読むー