文書構造を表現するXHTMLタグの正しいマークアップ HTMLタグリファレンス（1/10） - ＠IT
文書構造を表現するタグ 文書構造を表現するXHTMLタグを大まかに分類し、分類したタグをXHTMLの“要素”として、1つずつ紹介していきます。 これらの要素類はXHTMLの骨格（枠）となる部分を形成していくために使われる、XHTMLタグの記述（＝マークアップ）を行ううえで基礎となる要素類です。 htmlタグが一番の外側（先祖）となり、その内側（子）に上からhead要素、body要素といった順番でマークアップされます。 ページとして作成する（.htmlファイル）の文書構造を考慮し、情報構造として論理的に合っているかというのを考えながらマークアップを行いましょう。 html要素 htmlのそれぞれの要素はhtml要素を頂点とする階層構造になっています。 その中でhtml要素は最も基礎となる要素で、そのほかの要素はすべてがhtml要素の子や子孫（※）となる関係性になります。 なお、htmlファイ
[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
ウノウラボ Unoh Labs: CSSによるデザインワークと相性のよいHTMLって？
yamazakiです。最近だいぶあたたかくなってきましたね。おかげで日中眠くて仕方ないわけですがいかがお過ごしでしょうか。 ウノウに入る以前も含めてそれなりに長いことHTMLとCSSを書いてきたわけですが、今回は試みに、「だいたいこういうところに気を使われたHTMLだと、CSSでのデザイン適用やレイアウトがやりやすいな」というこれまでの経験則を簡単ですがまとめてみたいと思います。 まあ、このあたりはCSS書く人とHTML書く人の間でちゃんとルールを決めておけばいいだけの話なので、そもそも何の役に立つのか疑問といえば疑問ですが（笑 たとえばユーザがCSSを書いてスキンを作れるようなサービスを作る際、どういったHTMLにするかを決める、みたいな時には少し参考になる、かもしれません。 ID、クラスを適切に割り振って、要素がCSS側から一意に特定できるように たとえばグローバルナビゲーションとカ
3キャリア対応ケータイXHTMLのTIPS 8つ : アシアルブログ
という素敵仕様なので、泣く泣く各タグ内にstyle属性を書きます。 どーしても我慢できない場合は、外部スタイルシートをインライン展開するようなフィルターを作成するとかでしょうか。ググッてみたら、HTML::DoCoMoCSSというPerlモジュールを作成されている方もいらっしゃいました。 ■画像形式 GIFとJPEGであれば大丈夫なようです。 ・iモード対応コンテンツ作成時の仕様 | サービス・機能 | NTTドコモ ・KDDI au: 技術情報 > 機種別情報一覧 ・ソフトバンク 端末情報 Part1 ～ ソフトバンク 端末情報 Part4 ・Mobile Creation 対応フォーマット一覧 ただ、SoftBankの場合、 ソフトバンク 端末情報 と気になる記述があったりするのですが、この2機種は、 ・V801SHをご利用のお客さまへ ・V-NM701/V801SAをご利用のお客さま
data2htmlの詳細情報 : Vector ソフトを探す！
ソフト詳細説明 data2htmlはCSVやTAB区切りのデータから、HTMLコードで表に変換してくれるソフトウェアです。データはファイルから読込むか、Excelなどからコピーして変換処理されます。 ページのデザインは多彩な書式設定が可能です。背景色や枠線の太さなどを自由に指定でき、プレビュー画面で確認できます。 出来上がったHTMLコードはファイルに保存してWebページとして利用できます。 「data2html」のヘルプはインターネット接続によるオンライン.ヘルプを利用しています。下記のURLが表示されます。 http://www.ccppro.com/works/data2html/data2html000.htm
ウェブ制作・プログラマー・デザイナーのためのチートシート集 | コリス
Scott Klarrのエントリー「Cheat Sheet Index」から、ウェブ制作・プログラマー・デザイナーのためのチートシート集です。
グリッドレイアウトのための背景画像 - lucky bag
ウェブページをグリッドレイアウトするのであれば、あらかじめ CSS で背景画像にルーラーみたいな画像を指定しておけば制作時に便利じゃね？ってアイデア。 Subtraction: Grid Computing… and Design Airbag - Ruler. Using a Background Image Grid to Lay Out Your Web Site | Smiley Cat Web Design つうことで、自分が使いやすいと思う方眼画像をちゃちゃっと作ってみた。 gif画像（ご自由にどうぞ） grid.gif (GIF 画像, 200x200 px) 実際に適用してみたサンプル グリッドレイアウトのための背景画像のサンプル ルーラーの最小単位は 5px で、それより若干濃い線が 10px 、さらに濃い線が 50px、んでもって薄いグレーの背景が 100px 単位って
ウノウラボ Unoh Labs: フォームのユーザビリティを改善する10のTips
miyakeです。Webアプリケーションにおけるユーザーインタフェースの代表格と言えばフォーム。今日はそんなフォームのUIを作るに当たって、普段自分が心掛けていることをつらつらとご紹介します。 ■チェックボックスやラジオボタンはfieldset,label要素でくくる チェックボックスやラジオボタンには一般的にその内容を表すテキスト（ラベル）が付けられますが、input要素だけでマークアップした場合、チェックボックス（ラジオボタン）の部分しかクリックすることができません。 label要素を用いることで、ラベルの部分をクリックしてフォームを操作することが可能になります。これは是非設定しておきましょう。 ラベルをクリックできると思って期待を裏切られると、かなりのストレスになりかねません。 また、そのチェックボックスやラジオボタンのグループをfieldset要素で囲んでおくことをお勧めします。マ
ブロックレベル要素の高さを揃えるheightLine.js[to-R]
ブロックレベル要素の高さを揃えるheightLine.js Web標準の日々のグループディスカッションで出たライブラリ案を作っていく企画、第一弾。 ブロックレベル要素の高さを揃えるjsライブラリを作ってみました。 このライブラリは新バージョンがあります。 レスポンシブWebデザインに対応した「jquery.heightLine.js」 CSSでは複数のブロックレベル要素の高さを揃えれないという問題があります。 このheightLine.jsは、複数のブロックレベル要素の高さを揃える事ができ、2カラムレイアウトや3カラムレイアウトのそれぞれのカラムの高さを揃えたり、複数のブロックレベル要素をfloatで配置する際の高さを揃えたりできる、便利なライブラリになります。 設置方法 head要素内にダウンロードしたheightLine.jsを読み込みます。 <script type="text/ja
![ブロックレベル要素の高さを揃えるheightLine.js[to-R]](https://cdn-ak-scissors.b.st-hatena.com/image/square/a9717624309e36a795026e1b70982163687ccca2/height=288;version=1;width=512/https%3A%2F%2Fblog.webcreativepark.net%2Ficon_200x200.png)
css.maxdesign.com.au - CSS resources and tutorials for web designers and web developers
Can you take a simple list and use CSS to create radically different list options? The Listamatic shows the power of CSS when applied to a simple list. Go to Listamatic. Well, you asked for them. Nested lists! Choose from one of the growing number of samples or submit a list of your own. Go to Listamatic2. Step by step tutorials on using CSS to create background image lists, rollover lists, nested
Webデザインテクニック
ダイナミックHTMLやJavaScript、スタイルシートなどを用いた誰でも使えるデザインのテクニック集です。 サンプルソースはご自由にカスタマイズなどをしてお使いください。 訪問者を惹きつけるホームページを作りましょう。
水無月ばけらの HTML リファレンス
HTML4.0 の Transitional DTD を元に、各HTML のデータを加味して作成した HTMLリファレンスです。 水無月ばけらの HTMLリファレンス リファレンスを読む前に 要素リファレンス(分類順) [→アルファベット順]
趣味のWebデザイン
趣味のWebデザイン Lecture Advice Note Info 小説 記事検索： ゲームマーケット2019秋に出展します（2019-06-30） 8年ぶりのスタイルシート更新（2019-06-25） 『シン・ゴジラ』の中の私（2016-08-05） 採用活動で「応募者の名前をネット検索」は禁ずべき（2016-07-10） オフィスチェアの座面カバーを探す（2016-05-12） 近況（2016-05-11） 性同一性障害の新入社員（2014-04-28） 『銀河パトロール ジャコ』と私とKindle（2014-03-30） 小保方疑惑と卒研の思い出（2014-03-13） 次第に通話が減っていく（2014-02-26） 私が愛用している目覚まし時計 SEIKO SQ691K（2014-02-25） 「観光地で英語が通じない」問題（2014-02-17） 私は紐靴を買わない（2014
About the HTML 4.01 specification Japanese translation
HTML 4.01 仕様書邦訳概説 この文書は、W3Cにより作成されW3C勧告文書として公開されている "HTML 4.01 specification" (http://www.w3.org/TR/1999/REC-html401-19991224) を、HTML 4仕様書邦訳計画補完委員会が邦訳したものです。HTML 4.0仕様書補完委員会訳とは異なり、より仕様書らしい文体で日本語化してあります。 原著作権はW3Cが保有し、二次著作権はHTML 4仕様邦訳計画補完委員会が保有します。 正規の規定はW3Cサイトにある英語版であり、この日本語版は参考にすぎません。 邦訳の過程で気づいた原規定の誤りについては原著者に報告し、明らかなタイプミス等についてはerrataに掲載される前であっても修正した訳を掲げる場合があります。 この文書には、翻訳上の誤りがあり得ます。当委員会は翻訳の正確性を保証
窓の杜 - 【NEWS】好きなテキストエディターでHTMLタグ入力補完を利用できる「HTMLAssistant」
さまざまなテキストエディターでHTMLタグ入力補完機能を利用できるようにする支援ソフト「HTMLAssistant」v1.06が公開された。Windowsに対応するフリーソフトで、編集部にてWindows XPでの動作を確認した。現在、作者のホームページからダウンロードできる。 「HTMLAssistant」は、タスクトレイ常駐型のHTMLタグ入力支援ソフト。普段利用しているさまざまなテキストエディター上で、HTMLタグの入力補完を実現できるのが特長。 本ソフト起動中に任意のテキストエディターで“<”を入力すると、HTMLタグの要素や属性の候補リストがキャレット位置にポップアップ表示される。このとき、1文字入力するたびに該当するHTML要素が絞り込まれていく仕組み。また、属性に関してもキャレット位置の要素に対応する候補のみに絞り込むことが可能。 本ソフトは多くのテキストエディターに対応して
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[CSS]使いやすいスタイリッシュなフォームを実装する17のチュートリアル | コリス
HTML/XHTML Character Entities : HTML.SU
エラスティックレイアウトのベーシックテンプレート - Webテンプレート - 仮想空間
CYBER@GARDEN - Web作成、Webデザイン、HTML、XHTML、CSS、JavaScript
目次 | ばけらの HTML リファレンス(未完成)