第21回 ディスプレイのワイド化にページ・デザインをどう対応させるのか
PCのモニター・ディスプレイは，ここ数年で液晶が標準となり，併せてワイド化が進んでいます。ワイド液晶ディスプレイが登場するまでPCの画面構成比は，一部のノートPCなどの小型端末を除いて，「横4対縦3（640*480）」～「横5対縦4（1024*768）」という比率でした。解像度は「XGA（1024*768）」を大多数の環境としていればよく，XGAベースで構成しておけば「SXGA（1280*1024）」でも特に問題はありませんでした。 一時期，「サイトデザインはSVGA（800*600）を意識しろ」と言われていましたが，現実問題としてSVGAはほぼなくなりました。2006年の時点でディスプレイ全体の出荷台数に占める液晶ディスプレイの比率は99.7％（電子情報技術産業協会の市場調査結果）です。SVGAまでしか表示できない液晶ディスプレイはほとんどありませんから，これが現在の「XGAを標準解像度
pre 要素のスタイル定義とマークアップ - 2xup
2006-09-07T00:56:49+09:00 なにやら pre 要素に CSS でどういったスタイル定義をしているのか、また、pre 要素をどのようにマークアップしているのか、様々な意見がでている模様。 ブログにコードを貼り付ける方法で悩むの巻(i d e a * i d e a - Lifehacks by 100SHIKI.COM) pre要素へのスタイル指定(hail2u.net - Weblog) Re: i d e a * i d e a - ブログにコードを貼り付ける方法で悩むの巻(hxxk.jp) 情報共有と新たな発見を期待して、どのようにスタイル定義・マークアップしているのか公開することに。まずは注意しているポイントを挙げてみます。 Macintosh 版 Internet Explorer では、div 要素以外に値が visible (初期値) 以外の overf
jmblog.jp - ソースコードを表示させるのに使うべきHTMLタグは？
ソースコードをWebページで表示させるために、どんなHTMLを書いてますか？私はこれまで、<pre>…</pre> を使っていました。<code>…</code> というタグは知っていましたが、これだと半角スペースや改行がうまく反映されていない、という理由で使っていなかったのです。 が、Web標準の教科書という本を読んで、目からうろこが落ちました。 （pre要素の解説で） pre要素は、code要素と組み合わせてスクリプト言語やプログラミング言語のソースコードを示すのに使うのが一般的である。 （code要素、var要素、samp要素、kbd要素の解説で） コンピュータに特有のテキストを定義するには、次の4つの要素を使用する。 （略） これらはインライン要素であり、インライン要素やテキストを含むことができる。 そうだったのかー！code要素はインライン要素なので、半角スペースや改行が反映
WordPress：SOMY.JP » Blog Archive » <code>タグ内のスペースを表示させる
<code>タグというものがあります。 あまり知られていませんが、プログラムやスクリプトなどをHTMLに書くときに囲むタグです。 codeタグ内てテキストを記述するとそのテキストがそのまま表示されます。 機能はpreタグと変わりません。 しかし、半角スペースが表示されないのと、WordPressでは改行が余計に入ってしまうのでちょっとCSSをカスタマイズ。 cssのcode部分を以下に変更する code { color: #666; font-size: 12px; margin: 15px 30px 0 10px; padding-left: 20px; border-left: 5px solid #ddd; white-space: pre; display: block; } code br { display: none; } 上記のように記述すれば こ ん な こ と が出来ま
HTMLを組んだ後のCSSの作成に役立つあれ
What is it? Ok, here's the deal. Put your XHTML code below, we will grab it and send over to one of our scientists. He will do his voodoo and in return you will get a corresponding CSS frame. And yup, it's free. More information This tool returns corresponding CSS in a line-by-line way indented with spaces to reflect XHTML structure - each selector and all of its properties and values in one line.
CSSの擬似クラス「:hover」で作るちょっと変わったメニュー - Trans
IE7の大きな進歩の1つといえば、a要素以外にも:hover擬似クラスが指定できるようになったこと。では、これを使ってどんなWebデザインができるのかについて3つの事例を調べてみました。 CSS hover effect | Veerle's blogより。 サンプルはKansas City Homes for Sale | Prudential Kansas City Real Estateの真ん中あたりのタブです。タブ内にマウスを持っていくと背景色が変わると思います。 これを作るためには、次の2つの画像を用います。 コードはこんな感じです。解説はCSSのコメントと一緒に書いておきました。ちなみに、事例の3つとも画像置換を使っていますが、その説明は省略しています。 <h2>4 different ways to find your Kansas City Homes for Sale</
スペシャルベスト
免責事項：本サイトに含まれる情報は、一般的な情報提供のみを目的としています。情報はスペシャルベストによって提供され、当社は情報を最新かつ正確に保つよう努力しますが、いかなる目的においても、ウェブサイトまたはウェブサイトに含まれる情報、製品、サービス、関連グラフィックスに関する完全性、正確性、信頼性、適合性、利用可能性について、明示または黙示を問わずいかなる表明または保証も行いません。従って、これらの情報に依拠することは、あくまでもお客様ご自身の責任において行われるものとします。 当社は、当ウェブサイトのご利用に起因するいかなる損害についても責任を負いません。 本ウェブサイトから、スペシャルベストの管理下にない他のウェブサイトへリンクすることができます。当社は、それらのサイトの性質、内容および利用可能性を管理することはできません。リンクは必ずしも推奨するものではありませんし、リンク先で述べら
Academic HTML―HTML, XHTML and CSS Tutorials
Academic HTML へようこそ。Academic HTML では，HTML・XHTML と CSS を中心に，WWW ページ作成のチュートリアルを提供します。 Hints of fonts on the web を増補しました。(2009/06/06) Orientation to CSS，Toward Accessible WWW，Academic HTML 3.2 紹介ページ を復旧し，再公開しました。(2007/10/08) Passport to XHTML 1.0，More about HTML を復旧し，再公開しました。(2007/10/07) Soar through HTML を復旧し，再公開しました。(2007/09/24) Yes, we love HTML，Always with HTML を復旧し，再公開しました。(2007/09/23) Take off
正しく、早く、美しいコーディングを実現するために踏むべき5つのステップ::::::STOPN' LISTEN::::::to the silence:::::::
免責事項：本サイトに含まれる情報は、一般的な情報提供のみを目的としています。情報はスペシャルベストによって提供され、当社は情報を最新かつ正確に保つよう努力しますが、いかなる目的においても、ウェブサイトまたはウェブサイトに含まれる情報、製品、サービス、関連グラフィックスに関する完全性、正確性、信頼性、適合性、利用可能性について、明示または黙示を問わずいかなる表明または保証も行いません。従って、これらの情報に依拠することは、あくまでもお客様ご自身の責任において行われるものとします。 当社は、当ウェブサイトのご利用に起因するいかなる損害についても責任を負いません。 本ウェブサイトから、スペシャルベストの管理下にない他のウェブサイトへリンクすることができます。当社は、それらのサイトの性質、内容および利用可能性を管理することはできません。リンクは必ずしも推奨するものではありませんし、リンク先で述べら
WD Live! Web標準時代に求められるサイト構築法
Web標準時代に求められる サイト構築法 木達一仁 株式会社ミツエーリンクス WEB開発チーム フロントエンドエンジニア Web Standards Projectメンバー k-kidachi@mitsue.co.jp / kidachi@kazuhi.to 株式会社ミツエーリンクス WEB開発チーム フロントエンドエンジニア（2004年2月～） Web標準準拠サービスの立ち上げ/運用 Web標準Blogの運営 W3C Advisory Committee Representative 海外のWeb標準関連書籍和訳版の監修 Web Standards Project（WaSP）メンバー mixiにてWeb標準コミュニティを主催（2006年5月25日現在3260人が参加） 7月15日「Web標準の日」開催
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Blogger
コードを淡々と記録するよ
http://exploding-boy.com/images/EBmenus/menus.html
HTMLタグボード - HTMLタグ一覧、CSSリファレンスなど
CSS2 Note カテゴリ別
HTML Note A-Z
http://www7a.biglobe.ne.jp/~fwsc/index.htm