Re:犯してはいけないHTMLタグの過ち10個 ネタ元：犯してはいけないHTMLタグの過ち10個 基本的には良い記事なんだけども、原文が2年近く前の物でXHTMLを前提に書かれているので少しだけ内容が古いかなと思ったりします。 1. インライン要素の中にブロック要素を入れない <a href="#"><h2>これは間違いです</h2></a> aタグのようなインライン要素の中にhタグのようなブロック要素を入れてはいけません、となってるけどこれはHTML5的にはこれはあり。 a要素は基本的にフロー・コンテンツが記述できる場所に記述できます。ただ、他のほとんどのインライン要素はフレージング・コンテンツしか内包できないのでNG。 <span><h2>これは間違いです</h2></span> HTML5だとコンテンツモデルの概念が変わっているので要注意。 参考：コンテンツ・モデル - HTML5タ
お問い合わせはこちらへ 築地本願寺コンタクトセンター お問い合わせについては年中無休 （土日祝も受け付けております） 合同墓 0120-792-018 全日 9:00〜17:00 ご葬儀お問い合わせ 0120-792-076 当面、対応時間を変更しております。 全日 9:00〜17:00 その他各種お申込み 0120-792-048 全日 9:00〜17:00 取材や掲載のお問い合わせ
CSS による印刷制御に関するメモ CSS による印刷制御に関して個人的に抑えておきたいことをメモ。 改ページ page-break-before, page-break-after で改ページの制御が可能。 指定可能な値は auto、always、avoid、left、right のいずれか。 <div class="page" style="page-break-after: always;"> ここが 1 ページ分。 </div> Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification - 13 Paged media http://www.w3.org/TR/CSS2/page.html#page-break-props A4 に印刷する場合は 649px x 891px A4(210mm x 297mm)
Ham CutletはRuby/Sinatra製のフリーウェア（ソースコードは公開されている）。時々見かけるのだが、インデントが全く無視されたソースコードはとても見がたいものだ。Pythonだったら動きようもないが、他の言語の場合無視しようと思えばできてしまうので、とても辛い。 こんなに汚いソースコードが… プログラミング言語の場合、それでも統一はある程度できているのではないだろうか。問題はHTMLだ。時々ものすごいソースコードに出くわしたりすることがある。そんな時に使いたいのがHam Cutletだ。 Ham Cutletは既存のHTMLソースコードを貼付けて実行し、インデントを綺麗にして表示してくれるソフトウェアだ。インデントがきちんとすれば、タグの関連性が分かりやすくなりデザインの問題も発見しやすくなる。完了したソースはそのままコピーして利用できる。 こんな綺麗なHTMLに！ 最近は
Recently, I discussed the pitfalls of using custom HTML attributes and “expando” DOM properties to store per-element data. Thanks to the comments on that post I now understand that doing so is sometimes hard to avoid. Some people resort to using jQuery’s “metadata” plugin which can massively simplify the process of adding metadata (i.e. data about data). I’ve been meaning to post a technique I’ve
CSS HappyLife ZERO が移転したのでお手数ですが、消えちゃう前にブックマーク等変更してもらえるととても嬉しいです。 制作会社でコーディングする場合、社内のガイドライン的なのが有ったりデザイナーもある程度固定されてると思うので、毎回似たような事を確認したりとか、このデザインはどういう意図なんだろう？ってのも、何度か同じ人とやってれば見えてくる訳ですが、フリーランスの場合だとデザイナーは毎回違っていたり、当然ディレクションをする人も違うので最初に確認しておきたい事が有ったりします。 って事で、その辺りをまとめてみたり、デザインを渡されたときにこのデザインの意図は？って思う事とかもばーっと書いてみます。はい。 なので、デザイナーさんもコーダーにデザインを渡すときに気をつけて欲しい点とかもわかってしまうすばらしい内容（だと良いな）！ じゃあまずは最初に確認しておきたい基本的なことか
旧来のDHTMLの手法では、JavaScriptから操作できるHTML要素に限りがありましたが、DOMでは、HTML上のありとあらゆる要素を自由自在に読み取ったり、書き換えることができるようになります。本連載では、主にDOM Level 1で規定されている手法を使い、JavaScriptでどのようにHTML上の要素へアクセスするのか、そして、それをどうやって書き換えるのかを詳しく解説します。これにより、JavaScriptからHTML要素を手に取るように操れるようになります。 本連載は、ソフトバンククリエイティブ刊行の『標準DOMスクリプティング』のうち「第2章 DOMの基本」を、同社の許可を得て転載するものです。 本書は、DOM（Document Object Model）とJavaScriptの関係を分かりやすく解説しています。さらに、JavaScriptからDOMを介して、いかにして
もともとは存在しなかったタグ要素を新たに追加したり、変更、削除するテクニックを学ぶ。こうした処理ができるのはDOMならではの魅力だ。 旧来のDHTMLの手法では、JavaScriptから操作できるHTML要素には限りがありましたが、DOMでは、HTML上のありとあらゆる要素を自由自在に読み取ったり、書き換えることができるようになります。本連載では、主にDOM Level 1で規定されている手法を使い、JavaScriptでどのようにHTML上の要素へアクセスするのか、そして、それをどうやって書き換えるのかを詳しく解説します。これにより、JavaScriptからHTML要素を手に取るように操れるようになります。 DOMスクリプティングでは、HTMLをJavaScriptから自由自在に書き換えられる点が大きな魅力です。これまで、HTMLに存在する要素の参照方法や属性の扱い方を学んできましたが、
DOMを介してHTMLを操作する方法を理解しよう。そのためには、正しいHTMLの概念とドキュメントツリーを知る必要がある。 旧来のDHTMLの手法では、JavaScriptから操作できるHTML要素には限りがありましたが、DOMでは、HTML上のありとあらゆる要素を自由自在に読み取ったり、書き換えることができるようになります。本連載では、おもにDOM Level 1で規定されている手法を使って、JavaScriptを使ってどのようにHTML上の要素へアクセスするのか、そして、それをどうやって書き換えるのかを詳しく解説していきます。JavaScriptからHTML要素を手に取るように操れるようになります。 ドキュメントツリーとは DOMスクリプティングでは、HTMLに関する正しい知識が求められます。まずは正しいHTMLとはなんなのかを理解していただきます。そして、DOMスクリプティングでは欠
誰でも作れる！ “崩れない”HTMLメルマガ作成術：一撃デザインの種明かし（12）（1/4 ページ） キレイなHTMLメールを作るコツ/Tips盛りだくさん！ ECサイトはもちろん、企業サイトのニュースなど、いまなおプッシュ型の情報配信として支持されるメールマガジン。一時のフィードリーダーの盛り上がりもあり、以前に比べると落ち着きましたが、まだまだメールマガジンの効果は侮れません。 今回は、そんなメールマガジンの中でも、表現力豊かなHTMLメルマガの作り方について、徹底解説します！ 「HTML」自体は、それほど難しくないが…… 「HTML」というマークアップ言語自体はプログラム言語に比べると手が出しやすいので、Webを仕事としていない方でも触れた経験をお持ちの方はいらっしゃるのではないでしょうか？ そういう人にとっては、HTML言語自体はそれほど難しくないと思います。 しかし、そのHTML
Safari拡張をいくつか作って大体感覚は掴めたので、ざっくりと拡張の作成手順を解説してみます。 なお、Windows版で作業していますが、Macでもほとんど同じだと思います。 Safari拡張とは 最初に、Safari拡張とはなにか、について。Safari拡張はHTML/CSS/JavaScriptをベースに、ブラウザ側が用意したAPIを使ってブラウザを便利にするモジュールです。通常、JavaScriptだけではクロスドメインの問題など、実現できることに制限がありますが、その点を拡張用に用意されたAPIで補います。そのため、APIが用意されていない部分については対応できないという制限があります。しかし、開発のし易さ、ウェブとの親和性の高さからアイディア次第で便利で強力なツールとなるのがSafari拡張・Chrome拡張です。 なお、現状のAPIは暫定的なもので、ここで紹介するのもあくまで
outerHTML について outerHTML とは Mozilla 系のブラウザ以外のすべてのブラウザで使える要素の HTML が文字列として取得できるプロパティです。 alert(document.body.outerHTML); // => body の HTML がすべて見える（例：<body><h1>It works!</h1></body>） というわけで 以下のコードを書いてみました。 if (!('outerHTML' in document.createElement('div'))) { HTMLElement.prototype.__defineGetter__('outerHTML', function() { return this.ownerDocument.createElement('div').appendChild(this.cloneNode(tru
はじめに 本連載では、Web標準のメリットを最大限に活かすことをテーマに、仕様書には書かれていない部分を中心に取り上げ、実際のWeb制作現場で起こり得る問題について、解決の糸口を紹介しています。 多様なデバイス向けのページ制作として、前回は印刷用ページの作り方を紹介しました。連載第6回目となる今回は、携帯電話向けページの作り方を扱います。 携帯電話の国内3大キャリアと言えば、NTTドコモ、au by KDDI、ソフトバンクモバイルですが、それぞれに仕様が異なり、すべてのキャリアに対応させるには工夫が必要です。キャリアごとにページを作成し、ユーザーエージェントで振り分ければ、精度の高いデザインを再現できますが、それなりの制作・運用コストがかかってしまいます。本稿では、なるべくコストをかけずに3キャリアに対応した携帯サイトを制作・運用する方法を紹介します。 対象読者 XHTMLとCSSの基本を
棒グラフ 機能：ツールチップ、コンテクストメニュー、ズーム スタイルのバリエーションも豊富で、デモページには多くのグラフが掲載されています。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
