[ホームページ質問掲示板] XHTML・ブラウザ別CSS振り分け・擬似フレーム、の両立
> 誰でも解る無料ホームページ作成講座へ戻る [HOME] [新規投稿] [使い方] [解決済] 日時 ：2005-05-31 15:37:20 名前 ： ：ＵＲＬ ：記事の編集 投票 ： (？) 未解決に変更 [No.1] 日時 ：2005-05-31 17:47:37 名前 ： ：記事の編集 投票 ： (？) [No.2] 日時 ：2005-06-01 14:00:29 名前 ： ：ＵＲＬ ：記事の編集 投票 ： (？) [No.3] 日時 ：2005-06-01 14:55:14 名前 ：Pid ：記事の編集 投票 ： (？) [No.4] 日時 ：2005-06-01 18:24:55 名前 ： ：記事の編集 投票 ： (？) [No.5] 日時 ：2005-06-02 15:42:19 名前 ： ：ＵＲＬ ：記事の編集 投票 ： (？) [No.6] 日時 ：2005-06-02
A Bowl of Humor
Online dating is an amazing way of meeting new friends and even partners. With the millions of individuals all over the world who are into online dating, it isn’t a surprise to come across thousands of online dating sites that cater to different people from all walks of life with diverse dating needs, interests, and preferences. Whether you are love wines, passionate about nature, love meeting dif
d.aql - scriptタグの中にJavaScriptを書く正しい方法
XHTMLでCDATA区間を使う。以上。 経緯 HTML4のscriptタグでJavaScriptをちょろっと書く時、中にHTMLタグがあるとダメという話が発端である。例えば、以下のようなのがダメだ。 <script type="text/javascript"> document.write('<p><a href="http://www.hikoboshi.org">hikoboshi.org</a></p>'); </script>ちなみに、ブラウザで動かせば多分動く。（試してないけど。）じゃあ何がダメかというと、HTMLの仕様的に。ちなみにこういう書き方をすると、多分HTML4でもXHTML1でもダメだと思われ。 そんな話をきっかけに、いろいろ調べた。 何故ダメか まずはHTML4のDTDを調べる。（別にstrictを選ばなくても良いんだけどとりあえず。） http://www.w
我的春秋: 続 JavaScript ソースが HTML から消える日
なんか、はてなブックマーク経由で、突然、昔のエントリー（JavaScript ソースが HTML から消える日）にアクセスが集中しているのに気づいて、急遽、フォローアップ エントリーをアップすることにしました。あのエントリーを書いてからまだ半年ですけど、あの時点で僕が気づいていなかったことも幾つかありましたし、何より状況が随分変化してます。 手みじかにおさらいしておくと、「JavaScript ソースが HTML から消える日」で紹介したのは、Ben Nolan 氏が開発した behaviour.js という JavaScript ライブラリです。このライブラリは、関数の実行場所を、外部 js ファイル内で CSS セレクタを使って指定することができ、これによって従来 HTML 中に埋め込んでいたイベントハンドラ部分も含め、文書構造（document structure → HTML の役
CSS ハックまとめ Lucky bag::blog: IE7 を含むモダンブラウザ向け
Internet Explorer 7 は、 8 月にも beta3 がリリースされるかも知れないんだけど、今現在、IE7 beta2 を含むモダンブラウザに有効そうだと思われる CSS ハックを自分用にまとめておく。以前に IE 7 用の CSS ハックを紹介したことがあったけど、今回の Easy CSS hacks for IE7 - Nano See, Nano Do で紹介されていたハックは、比較的シンプルかも知れない。想定ブラウザは下記のとおり。 バージョン 6 以下の IE IE7 それ以外のモダンブラウザ（Safari、Opera、Firefox） ブラウザごとのハック 全てのサンプルは body 要素を指定の対象としている。 バージョン 6 以下の IE にのみ適用 * html body サンプルページ バージョン 7 の IE にのみ適用 *+html body サンプ
GIGAZINE - 検索エンジン最適化状態を一度に全部チェックする「SEOTOOLS」
チェックしたいサイトのアドレスを入力するだけでGoogleページランク、Yahoo!WEBランク、トラフィック世界ランク、サイト来訪者数、サイト来訪者の平均ページビュー、最重要に設定されているキーワード、最重要キーワードの月間検索数、Google/Yahoo!/MSNの最重要キーワードでのサイトの順位と競合数・狙い目数値、Google/Yahoo!/MSNの被リンク数、ドメイン取得年月日などがわかります。 今まであちこちの同種のサイトを使っていたのがかなり楽になります。国内サービスなので表示も全部日本語で、非常にわかりやすいです。 SEO TOOLS http://www.seotools.jp/ SEOアクセス解析ツール http://www.seotools.jp/001_seoanalyze/ SEO TOOLS - 順位チェックツール http://www.seotools.jp/
ブラウザによる見え方の違いをチェック | *LOVE IS DESIGN*
Webデザインや配色に役立つ（かもしれない）テクニック、便利なツールを紹介しています。 /*無駄にエロいのは仕様です*/ 01 About 02 Blog 03 Color 04 Design 05 Love 06 etc CSS をいじりだすと気になるのが、ブラウザによる見え方の違い。 このブログでは訪問者の約65％が Internet Explorer ユーザですが、最近は Firefox など Mozilla系や、Opera・Safariといったブラウザの方も増えているようです。 わたしはWinXP+スレイプニルという環境で更新作業をすることが多いのですが、はてなツールバーがスレイプニルでは使えないので、最近は Firefox をメインブラウザとして使用しています。（もうすっかりはてなっ子） CSS をいじったり記事をアップした後、スレイプニルで見た時は思ったとおりのデザインだったの
多くのユーザーは一度に1本しかジュースを買わない ― ＠IT
ユーザビリティのヒント（1） 多くのユーザーは 一度に1本しかジュースを買わない 「自動販売機での不要な動作から考える」 ソシオメディア 上野 学 2006/6/2 Webアプリケーションのユーザーインターフェイスデザインに役立つさまざまなTips集。自動販売機でジュースを買うときの不要な動作から考える。（編集部） 今回からはWebアプリケーションのユーザーインターフェイスの続編の「Tips編」として、ウェブアプリケーションのユーザーインターフェイスをデザインするうえで役立つさまざまなヒントを、少し細かな視点から具体的に見ていきます。 複雑な構成物を作り上げるには、基本となるコンセプトやアーキテクチャといった抽象度の高い部分から考えていくトップダウン式のアプローチと、構成要素の細部から考えていくボトムアップ式のアプローチの両方が必要になりますが、前回までの経験則編はどちらかといえばトップダ
css - ルビもCSSで : 404 Blog Not Found
2006年05月31日00:55 カテゴリTips css - ルビもCSSで これ、実はCSSでなんとかなります。 檜山正幸のキマイラ飼育記 - ルビ（ふりがな）タグの話 IE6では期待通りの表示（ふりがなの「おびただ」が「夥」の上に乗る）が得られます。FireFoxはダメでした、 以下をご覧ください。 夥 （おびただ） しい数のWebページ どうです? 当blogでは、現在以下をCSSに加えてrubyを実現しています。IEでもSafariでもFirefoxでもちゃんと見えます。 /* * based upon * http://www.akatsukinishisu.net/itazuragaki/2001_10.html#ruby_for_Mozilla_3 */ ruby { display:inline-table; text-align:center; white-space:
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標準の日」開催
GIGAZINE - CSSで角をもっと丸くする方法いろいろ
「スライディングドア」と呼ぶ方法で全体をヘッダー、ボディ、フッターの3つに分割して、コーナー部分などはオーバーレイとか使ってみましょう、という方法。 Another attempt at CSS rounded-corner dialogs using the sliding doors technique http://www.schillmania.com/projects/dialog/ 使用しているコードと画像のダウンロードはこちらから http://www.schillmania.com/projects/dialog/dialog.zip また、こちらに透過PNGを利用したバージョンもあります。 Another attempt at CSS rounded-corner dialogs using the sliding doors technique http://www.s
HatenaをXHTML+CSSで組みなおす
授業中、生徒は課題制作で忙しく僕は用無し。ってことで、○○○をXHTML+CSSで組みなおすシリーズ(?)第二段を勝手にこっそり作ってた。 なるべく皆が知ってるサイトで、コーディングが楽しそうなサイトを探してたのだけど、なかなか決まらず、結局、生徒のリクエストでhatenaのトップページを組みなおす事にしました。 hatenaは一部レイアウトにテーブルを使っているものの、基本はCSSでの段組がされているので、mixiを組みなおすような大きな軽量化は出来そうにない。なので、楽しみ方としては、いかに無駄なマークアップを減らしてシンプルなXHTMLで同じ見栄えを再現するかだ。 これがまた、パズルで遊んでいるときの感覚に似ていてとっても楽しい。近い将来、CSSで１つの要素に複数の背景画像がおけるようになったとき、このパズル感が失われてしまうと思うと残念でならない。(半分ホンキ) で、帰ってきて手直
Lucky bag::blog: IE で min-width を指定する方法
IE は min-width に対応していないんだけど、「Stu Nicholls | The CSS Playground」でスクリプトを使わず CSS だけで擬似的に min-width を指定する方法が紹介されていたんで、ざっくりとご紹介。この方法は、Win IE のみに効く方法で、Mac IE では機能しない模様。サンプルとして下記の (X)HTML を使用してみる。 <div class="container"> <div class="box"> <div class="contents"> 内容 </div> </div> </div> これに対して、幅 90% で最小幅 400px の指定をしてみる。IE5.5 と IE6 に対応したパターンと IE5.01 と IE5.5 と IE6 に対応したパターンの２種類の方法がある。 実際に試してみたサンプル IE5.5 と IE
フォント・フリーフォント情報サイト
無効なURLです。 プログラム設定の反映待ちである可能性があります。 しばらく時間をおいて再度アクセスをお試しください。
GIGAZINE - CSS3はこうなる
現在のところFirefoxなどのGeckoエンジンとOpera、それからSafari/WebKitベース以外のブラウザでは実現できていませんが、次の「CSS3」だとこういうことができるよ～という例。テキストに影を付けるとか、コーナーを丸くするとかなかなか面白い。CSS3 Preview - Joost de Valk http://www.joostdevalk.nl/code/css3-preview/ ブラウザのサポート状況は以下のサイトが上手にまとまっています。 Web Browser CSS Support http://www.webdevout.net/browser_support_css.php#css3standards W3CのページによるとCSS3というのはこんな感じらしい。 Introduction to CSS3 http://www.w3.org/TR/css3
Internet Explorer 7ベータ2の不具合からWebデザイン業界の混乱が見えてきた - 日経トレンディネット
次期Windows OS「Vista」に標準搭載される「Internet Explorer 7（IE7）」（日本語版）のベータ2が連休明けの9日公開された、という表向きの話はデジタルARENAのニュース「マイクロソフトがInternet Explorer 7 ベータ2を公開」を読んでいただくこととして、こちらはWeb業界には気になる、Web表示の互換性の問題に踏み込んでみよう。 まず、単純な話、IE7って使いものになるのか。なる。最初はメニューが見えないので戸惑うけど、Altキーを押せば出てくる。RSSリーダーの機能だってFirefoxとどっこいどっこい程度には付いている（笑）。マクロソフトの看板アプリケーションに抜かりがあるはずはない。 ところが、IE7で表示したとき、レイアウトが崩れてしまうサイトがいくつかあった。例えば、このコラムを書いている12日現在、「はてなダイアリー日記」はIE
CSSのレイアウト40種類を集めた「Layout Gala」 - GIGAZINE
サイトのコンテンツのレイアウトを考える場合、コンテンツをどのようなレイアウトでは位置すればいいのか悩む場合が多々あります。2コラムにするのか3コラムにするのか、それぞれのコラムの下にさらに子コラムを入れるのか否か、右サイドに置くのか左サイドに置くのか、などなど。 そんな場合に参考になるのがこの「Layout Gala」。CSSによるレイアウトの例が40種類あるので、自分の作りたいサイトのスタイルに近いレイアウトを実際に見てから、CSSファイルをダウンロードできます。Layout Gala http://blog.html.it/layoutgala/ 全部のレイアウトのファイルを詰め込んだファイルのダウンロードは以下から。 http://blog.html.it/layoutgala/allLayouts.zip また、「Yahoo! UI Library」にも単一のCSSファイルで100
Collection & Copy - 上下左右中央の件、改善、補足
Collection & Copy - 上下左右の中央にボックスを配置する id:inception9さんから、より簡単な方法をコメントで教えて頂きました！ありがとうございます。 これだ！これが正解だから、前回のが「バッドノウハウ(?)」なんですね。余分な空間用divもなくなり、ほんますっきりやわぁ。 ただ、どうも前回の元記事は「画面をコンテンツのボックスより小さくしても、ボックスの左上が欠けない」というところがポイントだったようです。たしかにウィンドウサイズを小さくすると、左上隅にボックスがきっちり収まります。ここにこだわらない場合は、短縮版がよさそうですね。 HTML、CSS、共に勉強不足ですので、直接指摘頂けるのは大変助かります。コメントを書く時間を頂けたことを、感謝しております。ではでは。 雑記軽い気持ちでHTML/CSSのことを書くと、なぜか反響が大きく、戸惑う。なんとなくプロ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.rju666.com/web/layout/imitate_frames.html
jugyo.org