CSS Globeのエントリーから、スタイルシートのレイアウトで生じる問題を解決する8つの1行のスタイルシートの紹介です。 8 Premium One Line Css Tips 縦方向のセンタリング 高さが固定されている場合、「line-height」を使用して、縦方向のセンタリングが実装できます。 デモページ <textarea name="code" class="css" cols="60" rows="5"> line-height:24px; </textarea>
テキストエディタでWebサイト構築をガンバル人へ:どこまでできる? 無料ツールでWebサイト作成(6)(1/3 ページ) 「あえて」テキストエディタでWebサイト構築 今回はテキストエディタと組み合わせることで、開発をより便利にできるツールについて考えてみよう。 現在「あえて」テキストエディタでの開発を行われている方には、現在使っているエディタを選択するまでの“経緯”や“こだわり”があると思う。筆者もこれまでにさまざまなテキストエディタを試し、「この程度のもので十分だ」と感じるテキストエディタを現在使っている。 テキストエディタ+α そこで今回は、テキストエディタ自体とそのプラグイン/拡張機能に関する紹介は行わないこととし、「どのようなテキストエディタを使っている場合でも、組み合わせて使うことでより簡単にWebサイト構築ができるツール」という観点で紹介したいと思う。もちろん、Webオーサリ
Internet Explorer5.0からビヘイビアという機能がサポートされました。ビヘイビアとは、HTML/Dynamic HTML/JavaScript等によって構成されるHTC(HTML Component)ファイルをHTML上で使用する機能です。 HTCファイルを使用することで関数の再利用/カプセル化を図ることができます。 ビヘイビア機能を使用するには、「behavior」プロパティにより行います。 Internet Explorer5.0からビヘイビアという機能がサポートされました。ビヘイビアとは、HTML/Dynamic HTML/JavaScript等によって構成されるHTC(HTML Component)ファイルをHTML上で使用する機能です。
CSS設定でオブジェクトを半透明にできるプロパティがあります。 IEのみのCSSプロパティでしたが、Firefox・Operaでも同じように表示可能にできる方法を説明したサイトがありましたので紹介しておきます。 他にもいくつかのOpacityプロパティを使ったTipsが紹介されていますので、参考に覗いてみてください。 CSS Opacity in Mozilla,IE, and Opera http://www.mandarindesign.com/opacity.html CSS Opacity設定 以下のコードでIE・Firefox・Opera・Netscape・Safariで同等表示がえられます。 filter: alpha(opacity=25); -moz-opacity:0.25; opacity:0.25; IE alpha(opacity=透明度); 100が100%とな
Web サイトのレイアウトに関しては、横幅を固定した固定レイアウト、ブラウザのウィンドウサイズと連動するリキッドレイアウト、文字サイズと連動するエラスティックレ... Web サイトのレイアウトに関しては、横幅を固定した固定レイアウト、ブラウザのウィンドウサイズと連動するリキッドレイアウト、文字サイズと連動するエラスティックレイアウトの 3種類がよく使われますが、どのレイアウトが一番文章が読みやすかったり、利便性が高いのかって考えたときに、当然好みは人それぞれ。 じゃあ、その人の好みで、3つのレイアウトを切り替えられるようにしたらいいじゃんということで、そんな CSS 切り替えスイッチを作ってみました。 サンプルはこちらで確認できます 全ファイルのダウンロードはこちら (zip ファイル / 10KB) デフォルトでは横幅固定のレイアウトになっています。スイッチを押すたびにレイアウトが選択
CSS-Discussにアップされている「IE 7 Bugs」の意訳です。 省略している箇所も多数あるので、原文も参照ください。 Internet Explorer Win Bugs - css-discuss 注意: バグには、IE7のみでなく、IE 5, 5.5, 6のものも含まれています。 公開されてから時間が経っているためか、ちょっと古いものもあります。 IEのフォントサイズのバグ フォントサイズの継承 IEの相対指定のフォントサイズの継承は、うまく機能しません。 相対指定を行う場合、emより%で指定を行う方が便利です。もし、em指定を行う場合は最初に%指定を行ってください。 例: body{ font-size: 100.01%; } ※100%の代わりに100.01%を使用するのは、Operaでの継承バグの回避のためです。 キーワード指定でのサイズ フォントサイズに「small
» Introducing Tablecloth テーブルクロスを導入する。 この記事がWEB関連のなかで話題になっていました。 はて・・テーブルクロス・・・。 何のことやらさっぱりだったんですが、使ってみるとなかなか素敵な動きをしてくれましたので記事に。 あなたのhtmlに2行のコードを加えたら・・・ By simply adding 2 lines of code to your html page you will have styled and active tables that your visitors will love あなたのhtmlにたった2行のコードを加えるだけで、あなたのサイトのテーブルは、あなたのサイトの訪問者に愛される。 なんとも素敵な響きだなと思った人はデモを見てみましょう。 » デモはこちら テーブルによって大量のデータを出力するときには便利な機能ですね。
CSSは柔軟な書き方に対応するフォーマットだが、運用を続けていくと構造の階層が乱れていったり、フォントサイズの設定が様々な場所に散らばったりと管理しづらくなっていく。 データを上手に管理すべく、プログラマブルなCSSを導入してみるのはいかがだろう。 今回紹介するオープンソース・ソフトウェアはMoonfall、CSSジェネレータだ。 Moonfallはスクリプトで定義する変数のリストと、CSSテンプレートからなる。CSSテンプレートには[]で囲むと数値や文字に置き換わる。ハッシュで定義してCSS指定をまとめることもできる。 fillと言う関数を利用すると、二、三段のカラム生成が容易にできる。幅や一部のカラムの大きさを指定すれば、あまった場所については自動計算してくれる仕組みだ。 現状のCSSは言わば各数値、文字列がハードコーディングされた状態だ。柔軟なデザイン変更に対応するにはやはり変数化が
An alternative to image-only CSS maps has been published. If you're looking for an easier way of creating image maps involving a single image, you may be interested in reading CSS Image Maps, Redux Below is a sample image map that's built entirely using CSS and XHTML. While I've added support for Javascript (item titles are simply displayed beneath the image), I've disabled it in this example -- I
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く