実際にページとして表示されているのは，どのタグで指定した部分でしょうか。 1．<title>タグ 2．<body>タグ 3．<head>タグ 4．<table>タグ
htmlに関するmaRkのブックマーク (199)
-
maRk 2008/10/14
-
brタグ、pタグやtableタグが非推奨にならない理由 - OKWAVE
> HTMLで最低限の外見制御 まだちょっと主従関係について混乱されているようです。 HTMLの要素がデザインに影響する機能を持っているのではなく、 それが何であるかを示すためにマークアップをすると 結果として（視覚化するブラウザでは）表示に影響が出るのです。 ページを表示する≒(X)HTML文章を伝達する、ために存在するブラウザが 段落だから行間を空けてやろうとか 表だから縦横に並べてやろうとか それなりの視覚化を行っているだけです。 行間がどうなるとか外見の制御を念頭においてを考えるのではなく 本質的にそれが「何」であるかをマークアップするのが文章の論理構造を記述するという事です。 一般的に外見から考えたほうが理解しやすいので 縦横に並べたいと思えばそれは恐らくリストや表だし、 一行空けたいと思えばたぶん段落の切れ目ですが 理念は逆ですのでお間違えのなきように。 重ね重ね、ありがとうご
-
HTMLをシンプルに保ちつつ、横並びリンクの区切りを表現する方法 | バシャログ。
横並びのリンクメニューを作成するときに | （区切り）を表現する方法はいくつかあると思いますが、 今回はシンプルなソースで実現する方法を、紹介したいと思います。 HTML は <ul> <li> のみでシンプルに。 <ul> <li><a href="http://c-brains.jp/blog/wsg/">ホーム</a></li> <li><a href="http://c-brains.jp/blog/wsg/about.html">はじめての方へ</a></li> <li><a href="http://c-brains.jp/blog/wsg/contact.html">お問い合わせ</a></li> <li><a href="http://feeds.feedburner.jp/bashalog">RSS Feed</a> </li> </ul> CSS <ul> に widt
-
コピーライトはaddressタグで囲ってみる | Igaloglog
コーディングしていらっしゃる皆さんは、コピーライトって何のタグでマークアップしてますか？ 別に<p>でもいいと思うんですが、ここは<address>でいってみてはいかがでしょうか？ <ADDRESS>タグはその文書に関する連絡先・問合せ先を表します。 タグの名前は<ADDRESS>ですが、住所に限らず、ホームページのリンク先・メールアドレス・住所・電話番号・FAX等 連絡をとるために必要な情報を配置することができます。 つまり、作者情報を載せても問題ないわけです。ない、ですよね？ 実際にサイトに住所などを掲載する場合は、そこに address タグ使えばいいと思うんですが、そういう情報がない場合。 コピーライトに使っても問題あるまい。と思います。 まぁ、コーディングでの組み方によっては<p>で組んだほうがイイという場合も必ずありますからね。 そういう場合は、適材適所というか臨機応
-
-
-
Valid HTML/XHTML - I'll sleep on it.
HTML-lintというと、まあ一般的にはAnother HTML-lintを指すだろう。って何処の一般なのかは知らんが。Another HTML-lintは非常に良いサービスで、単なる文法チェックにとどまらず、いわゆる宗教的と呼ばれるたぐいの文法であるとか、WCAGに基づくアクセシビリティのチェックまでも出来たりする。 あー便利だ、便利。マジ便利。 このチェックは採点方式で行われるのだが、DTD的にはあくまでValidな文書であっても、実際には減点されたりもする。たとえば、span要素が空だったり、p要素の中がbr要素だけだったりとか、こういうのは減点される。Authorは減点されるのを防ぐがためだけに、見栄え的に影響をあまり及ぼさない範囲、つまりたとえば空白を入れてみたりする。今のAnother HTML-lintではそれでも警告を発する。いやー素晴らしい。単にDTD的にValidかI
-
target="_blank"を使わずに別ウィンドウで開く
通常外部リンクなどを別窓で開く際に、target="_blank"を使うと思うのですが、コレは非推奨となっているので、もうちょっと美しく別窓で開くにはどうしたらいいか？ と何度か考えた事がありますが、適当にぐぐると、JavaScriptを使うものが何点かあるけど、ソレもイマイチスマートじゃない。 例えば下記で紹介されているような。 http://allabout.co.jp/internet/hpcreate/closeup/CU20040118A/ コレはコレで今までの問題を解決するにはいいのかなーと思うのですが、ボクが個人的に求めているのはもうちょっとスマートなやり方。 今まで、この問題に関して深く調べた事が無かったのですが、雲のむこうの人からこういう方法もあるよ。 って教わったので、今回はそのやり方を紹介いたします。 取り合えず、何だかんだ言って結局JavaScriptを使うわけです
-
SEOだけで満足できない人のためのmetaタグ情報まとめ (後編)
SEOだけで満足できない人のためのmetaタグ情報まとめ (前編) 「http-equiv編」 このエントリは上記のエントリの続きです。前回のエントリでは触れなかった、metaタグのname属性を持つものについてまとめたいと思います。metaタグの中で一番有名ともいえる、「meta name="keywords"」(キーワード)や「meta name="description"」(概要)もこちらに含まれます。 meta name (name属性)とは メタデータとはそもそも「文章の中身ではなく、HTML文章そのものについてのデータ」を記述するところです。前編のhttp-equivで出てきた「content-type」や「content-language」も「このHTMLの文字コードはUTF-8」だとか「日本語の文章である」と指定して、ユーザーエージェント*1に情報を与えているわけです。当然
-
今よりちょっとだけクオリティを上げるために。
執筆が終わったと思えば、主業務が激務でネタがちらほら浮かんでたのに書けない今日この頃。 でも、どこぞのiPhoneネタと宣伝ばかりになってしまったブログよりいいかも知れません。えぇ。 さて、CSSってある程度覚えてしまえば思った以上に簡単に組めたりして、何となく組めている気がするって思ったりしないっすかね。 もしくは、その逆になーんかイマイチ成長してないようなって感じてる時とか。 そんな状況のときに、今よりちょっとだけコーディングのクオリティや効率を上げるのに意識する事とかやっておくべきこととかを思いつくままに上げてみます。 仕事としてってのがベースなので、個人サイトやブログレベルだと当てはまらないかも。 ボクが昔はやってなかったけど今は当たり前な事とか、今でも忘れがちな事とか、何かそういう感じのことを書いていくので、人によっては当たり前だし、ちょっとした発見がある人も居るかも？ よく分か
-
-
W3CのW3C Markup validatorにHTML5が追加されました
HTMLの文法チェックにはW3C Markup validatorが欠かせませんが、これまでHTML5には対応していませんでした。そのため、Validator.nu を試したことがある方が多いのではないでしょうか。 しかし、ついに、W3C Markup validatorもHTML5にも対応した旨、W3Cのメーリングリスト www-validator@w3.org、そして、W3C Q&A Weblog にてアナウンスされました。まだHTML5のバリデートについては実験的な位置づけのようですが、使い慣れたインタフェースでバリデータが利用できるのは便利ですね。 HTML5に準拠したページをチェックした場合の結果がこちらでご覧いただけます。 http://qa-dev.w3.org/wmvs/HEAD/check?uri=http%3A%2F%2Fintertwingly.net%2Fblog%
-
まずはHTML。ハイパーなタグ付き言語（1/5）＜デザイナーのためのWeb勉強帳（1） - ＠IT
Webページを構成する技術を超初心者向けに説明。まずは基本の基本である「HTML」について。ハイパーなタグ付きテキストを一緒に解読しましょう インターネットはHTMLでできている？ インターネットの利用者は総務省の調べによると、平成18年度のおととしの時点で8754万人に達したそうです。人口に対する普及率は68.5％で、およそ7割の人が、インターネットを利用していることになります。言われてみれば、60歳以上の年配の方が、メールやチャットでのコミュニケーション、サービスや製品の評判や性能を調べたり、通販やオークションサイトで商品を手に入れたりしていると聞いても、そんなに驚かなくなってきました。 どっぷりとインターネットが生活にしみこんできているのですが、そんな中で、一番皆さんの目に触れやすいのがWebページだと思います。 そして、この記事を読んでいる人は、Webページ制作にかかわっている人が
-
アイコンやサムネイルの横にタイトルと概要文があるような時。
とりあえず、暑いっす。えぇ。 ここ最近の暑さにやられ気味なhirasawaです。そんなやられ気味な状況なので、HappyLifeも夏っぽくしてみました。 あと、弊社のベトナム事業部の女性マネージャーがブログを開始しました。 ベトナムに興味がある方や女性マネージャーに興味がある方、更新率も高いので、ぜひに。 さて、そろそろ本題に。 こんな感じで、アイコンとかサムネイルがあってその横にタイトルと概要文があるような、そんなデザインってよく見かけるかと。 今回は、これの組み方の一つとしてサンプルを用意してみました。 サンプルの確認は以下より。 サンプルを見る こういうデザインの場合、どうやって組もうか結構悩むんです。 何に悩むって、この画像をどうやってマークアップするか。 今まで多かったパターンは、基本的には定義リストを選んで、ddに入れたりしてましたが、コレだとリンクを画像とdtに張る必要があっ
-
-
img要素とbefore/after擬似要素の関係 - WebStudio
もずはっく日記(2008年7月) 2008年7月20日 img要素とbefore/after擬似要素の関係 初回投稿日時: 2008年07月20日01時43分15秒 最終更新日時: 2008年07月20日02時37分46秒 カテゴリ: CSS SNS: Tweet (list) ZDNetのcontentプロパティでコンテンツを追加する（2）：FirefoxとSafariのCSSにalt属性の値を画像のキャプションとして表示するという記事がありますがCSS仕様の解釈が間違っていると思います。私も昔、同様に考えていたのですがIan Hicksonにこの考え方は間違いであると説明されたことがあります。 まず、before、after擬似要素とはどんなものかを正確に知らなくてはいけません。これらの擬似要素は、その要素の前後ではなく、内容の前後に新たな内容を追加するものです。つまり、 foo:
-
-
HTML をシンプルに保ちつつ、ブロック要素の段組みを実現する方法 パート2 | バシャログ。
「HTML をシンプルに保ったままブロック要素を段組みする方法」のパート 2 です。 前回の記事では、float と position の合わせ技により、全体の横幅ピッタリに要素を段組みしました。 今回は、position を使わない方法をご紹介します。 ボックスと余白の幅の値は前回と同じく以下です。 HTML ソースも前回と同じくこちら。無駄な ID や class のないシンプルなソースになっています。 <div id="photo"> <ul> <li><img src="hoge1.jpg" alt="サンプル1" width="160" height="120" /></li> <li><img src="hoge2.jpg" alt="サンプル2" width="160" height="120" /></li> <li><img src="hoge3.jpg" alt="サン
-
hxxk.jp - 唐突に手書き日記
記事データ 投稿者 望月真琴 投稿日時 2008-07-02T20:15+09:00 タグ HTML はてな はてなブックマーク アクセシビリティ 仕様 日記 概要 友人とのメールのやり取りを発端とした手書き日記。この形の日記の時は alt 属性だろうか longdesc 属性だろうか、と考えるあたりが私らしいというか何というか。 リプライ 1 件のリプライがあります。 仕様書における alt 属性および longdesc 属性の該当箇所 もちろん誰かの意見を聞く以前に仕様書の記述をあたれって話ではあるんですが、 This attribute specifies a link to a long description of the image. って、どのくらいの分量から long って言うんだ、と思ったので書いた次第。 longdesc 属性って何 ? という方は、次に仕様書の該当箇所
-
クロスブラウザのためのHTML/CSSのテクニック集 | コリス
anthonyshortのエントリーから、クロスブラウザのためのHTMLとCSSのテクニックの紹介です。 How to get Cross Browser Compatibility Every Time 簡単な意訳なので、詳細やキャプチャは上記エントリーを参考ください。 サマリー doctypeはstrictを使用し、正しいHTML/CSSを使用してください。 スタイルをリセットするスタイルシートを使用してください。 Firefoxでのレンダリングのために、テキストのスタイルシートに「-moz-opacity:0.99」を指定してください。 Safari用には「text-shadow:#000 0 0 0」を使用してください。 画像のリサイズをCSS/HTMLで行わないでください。 全てのブラウザでフォントのレンダリングを確認してください。 「Lucida」は使用しないでください。 テキ
Blogger
公式Twitter
- @HatenaBookmark
リリース、障害情報などのサービスのお知らせ
- @hatebu
最新の人気エントリーの配信
キーボードショートカット一覧
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Copyright © 2005-2024 Hatena. All Rights Reserved.
設定を変更しました