jmblog.jp - ソースコードを表示させるのに使うべきHTMLタグは？
ソースコードをWebページで表示させるために、どんなHTMLを書いてますか？私はこれまで、<pre>…</pre> を使っていました。<code>…</code> というタグは知っていましたが、これだと半角スペースや改行がうまく反映されていない、という理由で使っていなかったのです。 が、Web標準の教科書という本を読んで、目からうろこが落ちました。 （pre要素の解説で） pre要素は、code要素と組み合わせてスクリプト言語やプログラミング言語のソースコードを示すのに使うのが一般的である。 （code要素、var要素、samp要素、kbd要素の解説で） コンピュータに特有のテキストを定義するには、次の4つの要素を使用する。 （略） これらはインライン要素であり、インライン要素やテキストを含むことができる。 そうだったのかー！code要素はインライン要素なので、半角スペースや改行が反映
HTML/JavaScriptをインクルード表示させる方法 | エンタープライズ | マイコミジャーナル
WebページでHTMLやJavaScriptを表示させる場合に厄介な問題がある。実際のソースコード、たとえばそれはHTMLやJavaScriptだったりするわけだが、実際に使われるそういったコード保守する必要があるほか、そのコードを表示させているHTMLの方に含まれているコードも保守する必要があるということだ。 大量のチュートリアルを作成している場合などは特に面倒なことになる。デモコードを書き換えるごとに、それを表示させているHTMLの方に含まれているコードも変更しなければならない。編集を忘れてしまえば実際に動作しているコードと表示されるコードが違うという事態にもなる。 同じことを考えるプログラマは多いようだ。Christian Heilmann氏は1月29日(米国時間)、Displaying source code with Ajaxのタイトルのもと、外部のファイルをインクルードして表示
[Think IT] 第1回：携帯サイトとPCサイトはここまで違う！ (1/3)
XHTML Mobile Profileに対応したHTML 本連載では、「PCサイトを制作してきたけど、携帯サイトは初めて」といった企業や個人クリエイター向けにPCとモバイルの違いなどをふまえ、携帯サイトを公開するまでの入門的なノウハウを紹介していきます。 まず、今回はHTMLの種類やタグ、CSSなど携帯ブラウザによる違いと、画面サイズやキャッシュ容量などの端末による違いについて紹介していきます。 では、早速携帯サイトを作る上でマークアップの基本となるHTMLについて説明します（図1-1）。携帯電話はPCと比べても非常に早い進化を遂げてきたため、どれも基本はHTMLを基準に作られていますが、携帯ブラウザ（iモード、EZweb、Yahoo!ケータイ）で表示可能なHTMLの仕様には実に多くの種類が存在します。 現在市場に出回っている機種ということに限定すれば、XHTML Mobile Prof
3G端末（FOMA・WIN・3GC）のモバイルサイトのコーディング＆デザイン - livedoor ディレクター Blog(ブログ)
こんにちは。『Cure』や『livedoor 歌詞』を担当しているモバイルディレクターの吉沢です。 つい最近、PC サイトのディレクターが初めてモバイルサイトの開発を担当するという機会がありました。 どの情報を伝えれば初めてモバイルサイトを担当する人にもスムーズに進められるのか、PC とモバイルで一番特徴のあるコーディングとデザインについて、これだけ覚えておくと簡単な3G（FOMA・WIN・3GC）端末用モバイルサイトが作れてしまうノウハウをご紹介したいと思います。 【01】対応端末について こちらの記事にもあるとおり、3G 端末（FOMA・WIN・3GC）がアクセスの9割を占めているため、これからオープンさせるサイトの対応端末は、3G 端末で十分そうですね。 サイトの内容にもよりますが、下位端末（PDC・P型・C型など）を対応端末として含めてしまうと、機能や容量制限などに悩まされ、逆に運
Dreamweaverの代わりになるフリーソフト「Aptana」 - GIGAZINE
JavaScriptの開発環境、要するにJavaScript用IDEという位置づけなのですが、HTML、CSSの構造をアウトラインで示してくれたり、文法の間違いを指摘してくれたり、やっていることはほとんどDreamweaverの持っている機能と同じです。 特に面白いのはJavaScriptやCSSなどがInternetExplorerとFirefoxに対応しているかどうかが一発で分かる点。JavaScriptのエラーについても細かい部分まで指摘してくれます。つまり、実行しなくてもエラーがドコにあるのか分かる「静的解析」が可能というわけ。 Windows、Macintosh、Linux版があり、Eclipseプラグインとして動作するバージョンもあります。 スクリーンショットや実際に動かして機能を解説しているムービー、ダウンロードは以下から。 Aptana: The Web IDE http:
IE CSS Bugs That'll Get You Every Time | CSS-Tricks
DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! IE 6 actually had the best CSS support of any browser when it first came out… SEVEN YEARS AGO. The little bugs in it’s CSS support still haunt us to this day. I still get comments from people who roundly reject any technique that doesn’t work in IE 6. While I generally refuse to pander to IE
2010年に勧告される「HTML5」は「HTML4」と何が違うのか？ - GIGAZINE
現在、ネットで一般的に使用されているHTML言語は「HTML 4」であり、1997年12月18日にW3C勧告として仕様が発表されたものです。これが実に10年以上の月日を経て、バージョンアップと言っても差し支えない「HTML 5」になるとのこと。最終版が登場するのは2010年9月頃の予定。 というわけで、来たるべき「HTML 5」時代に向けて、一体何がどう変わったのか、何が便利になるのかを見てみましょう。 HTML 5 HTML 5 differences from HTML 4 HTML 5 における HTML 4 からの変更点 面白いのがブログや記事向けの「article」要素や、画像やビデオなどの埋め込み内容に説明文やキャプションを付加する「figure」要素、マルチメディアのための「audio」および「video」要素、さらに新しい属性としてリンクをたどるときにpingされるリソース
ウェブ制作・プログラマー・デザイナーのためのチートシート集 | コリス
Scott Klarrのエントリー「Cheat Sheet Index」から、ウェブ制作・プログラマー・デザイナーのためのチートシート集です。
eclp.net - このウェブサイトは販売用です！ - eclp リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
DLをTableに見せる
コンテンツメニュー dtにメニューの名前、ddに説明。 プロフィール dtに項目名、ddにその項目の値。 dtに「血液型」、ddに「B型」など。 リンク dtにサイト名、ddに説明やバナー。 ギャラリー dtに画像、ddに説明など。(複数のリストの場合) チャット・対談・会話 dtに発言者名、ddにメッセージ。 /* dl-sample */ #sample * { margin:0; padding:0; border:0; } #sample dl { border-top:0; border-bottom:1px solid; border-left:1px solid; border-right:1px solid; background:#eee; } #sample dt { float:left; clear:both; width:9em; padding:0.5em; _
SSIならぬクライアントサイドインクルード（CSI）を実現できる「sprinkle.js」:phpspot開発日誌
Sprinkle Javascript library by Jon Davis This is basically CSI (Client-Side Includes), when SSI (Server-Side Includes) is not available. You can also call it "sprinkle", as that's the name I gave the Javascript library. SSIならぬクライアントサイドインクルード（CSI）を実現できる「sprinkle.js」。 SSIとは、指定の位置に決められたタグを埋め込んでおくことで、サーバ側で処理して特定の文字列を出力する仕組みです。 今回紹介するCSIは、JavaScript を使い、DIV要素内にsrcで指定したファイルをAjaxで読みこむという仕組みです。 次のようなコードで、
CSSによる画像置換問題概観 - Liner Note
画像置換問題とは想定ユーザ像アクセシビリティ確保における優先順位の付け方おまけ画像置換問題とはウェブ技術に詳しい方には耳‥画像置換問題とは ウェブ技術に詳しい方には耳にタコができるくらい聞いた話ではありますが。 これはミツエーリンクスで解説されている通り、HTML文書でマークアップしたテキストを、CSSで画像に置き換えて表示させる手法で、具体的にはテキストはdisplayプロパティで隠したり、あるいはtext-indentやpositionプロパティを使って画面外に追いやり、画像を親要素の背景画像として表示させる感じで実現します。 このテクニックに対する問題点も同ページで指摘されていて、CSSが有効かつ画像は非表示という閲覧環境において（中略）適用箇所については一切の情報が得られなくなることです。 この功罪については、画像置換の問題点 - てんぽという記事に表でまとめられていて、わかりやす
各ウェブブラウザのデフォルトフォントサイズのまとめ
OS 毎に各ウェブブラウザのデフォルトフォントサイズをまとめてみました。 最近のウェブブラウザは、フォントサイズが同じになっているみたい…。 ## Windows のウェブブラウザ | ウェブブラウザ | プロポーショナル ( Proportional ) | 等幅 ( Monospace ) | | ——————— | ——————————— | —————— | | Firefox 1.0 | 16px ( 12pt ) | 16px ( 12pt ) | | Google Chrome 0.2 | 16px ( 12pt ) | 13px ( 10pt ) | | Internet Explorer 6.0 | 16px ( 12pt ) | – | | Internet Explorer 4.0 | 16px ( 12pt ) | – | | Netscape 7.2 | 16px
フレームの代わりにPHPを使う//Web屋のネタ帳
Ywcafe.net This Page Is Under Construction - Coming Soon! Why am I seeing this 'Under Construction' page? Related Searches: Best Mortgage Rates fashion trends Parental Control Cheap Air Tickets find a tutor Trademark Free Notice Review our Privacy Policy Service Agreement Legal Notice Privacy Policy
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Free CSS Templates & Wordpress Themes | CSS Design Templates
IDEA * IDEA
Free Layouts.com | Websites
はてな - cssを使ったおしゃれなformのデザイン方法について書いてあるサイトを教えてください。web2.0的なフォームを作りたいと考えています。 http://demo.mooflex.net/mooflex/in..
PHPを拡張子 .html で動作させたい時、.htaccess に何と記述したらいいか教えて下さい
掲示板/スタイルシート質問板/Open Error: 645.dat - TAG index Webサイト