タグ

ブックマーク / coliss.com (4)

  • 無駄なdiv要素やclassだらけのマークアップから卒業する方法

    グリッドベースのレイアウトを作成すると、ついついdiv要素を多用してしまいがちですが、意味のあるデータにはそれに適した要素を使用し、無駄なdiv要素やclassだらけのマークアップから卒業する方法をWebdesigner Depotから紹介します。 Fight Div-itis and Class-itis With the 960 Grid System 下記は各ポイントを意訳したものです。 はじめに CSSのフレームワーク:960.gsの場合 classの乱用を避ける リスト要素の使用 画像とキャプションの使用 複数の見出しとパラグラフの使用 子要素のclassは親要素に はじめに 数年前までウェブページの設計はテーブルがスタンダードでした。そしてCSSはそれを大きく変え、今日ではCSSのフレームワークがウェブページの設計を容易にしてくれています。 しかしながら、このCSSのフレームワ

  • [JS]ブラウザのサイズに合わせてレイアウトがアニメーションで変更されるスクリプト -Sliding Resizable Grid

    <textarea name="code" class="html" cols="60" rows="5"> <div class="slidegrid"> <div class="cell bigcell">Big Cell 1</div> <div class="cell">Cell 2</div> <div class="cell">Cell 3</div> <div class="cell">Cell 4</div> </textarea>

  • 二乗(2乗)の入力方法

    平方メートルなどに使用する「二乗(2乗)」や「三乗(3乗)」の入力方法の紹介です。 二乗(2乗)の表記 二乗(2乗)の表記 100m² 二乗(2乗)をHTMLで記述する場合は、下記のように記述します。 「&sup2;」の箇所が、ブラウザに表示される際に「²」となります。 二乗(2乗)の入力方法 100m&sup2; 三乗(3乗)の入力方法 三乗(3乗)をHTMLで記述する場合は、下記のように記述します。 三乗(3乗)の表記 100m³ 三乗(3乗)の入力方法 100m&sup3; 他の平方根は、一乗は「&sup1;」で表記できますが、四乗以降は表記できません。 補足説明 この二乗と三乗の表記に使用しているのは、「HTMLの実体参照」を利用しています。 「実体参照」とは、HTML文書などで直接記述できない文字や記号を表記する際に使用される方法です。 英数字をはじめ、文字・記号がこれにより表記

    二乗(2乗)の入力方法
    gam-22
    gam-22 2010/02/01
    &sup2;
  • JPEG画像をより美しく、より軽量に最適化するテクニック

    JPEG画像をより美しく、より軽量に最適化するテクニックをSmashingMagazineから紹介します。 Clever JPEG Optimization Techniques 1. 「8ピクセル」のグリッド 2. カラーの最適化 3. JPEG最適化の一般的なTips 1. 「8ピクセル」のグリッド JPEG画像は、あなたが既に知っているように8x8のピクセルのブロックから成り立っています。画質を低くするとよく分かります。 この8x8ピクセルを利用して、JPEG画像を最適化します。 画質10で作成したサンプル 二つの正方形は同じ大きさ(8x8ピクセル)です。左上のはきれいに見え、右下のは汚く見えると思います。 これらは、それぞれ8x8のグリッドに並べたもので、左上はグリッドに揃えたもの、右下はグリッドに揃っていないものです。 保存する際に画像は、8x8ピクセルのブロックに分けられるため

  • 1