タグ付けされた質問 「semantic-markup」

7
<span>の代わりにアイコンに<i>タグを使用する必要がありますか?[閉まっている]
休業。この質問は意見に基づいています。現在、回答を受け付けていません。 この質問を改善してみませんか?この投稿を編集して、事実と引用で回答できるように質問を更新してください。 3年前休業。 私はFacebookのソースを調べましたが、&lt;i&gt;タグを使用してアイコンを表示しています。 また、今日はTwitterのBootstrapを調べました。また、&lt;i&gt;タグを使用してアイコンを表示します。 だが、 HTML5仕様から: I要素は、代替の音声または気分でテキストの範囲を表すか、そうでなければ、分類学的指定、専門用語、別の言語の慣用句、思想、船名、またはその他の通常の散文からオフセットされます典型的な活版印刷のプレゼンテーションがイタリック体になっている散文。 &lt;i&gt;タグを使用してアイコンを表示するのはなぜですか? それは悪い習慣ではありませんか? または、ここで何か不足していますか? 私はspanアイコンの表示に使用していますが、今までは問題なく動作しているようです。 更新: Bootstrap 3はspanアイコンに使用するようになりました。公式ドキュメント

7
<code> vs <pre> vs <samp>(インラインおよびブロックコードスニペット)
私のサイトには、いくつかのインラインコード( " foo()関数を使用する場合...")といくつかのブロックスニペットがあります。これらはXMLになりがちで、非常に長い行が含まれているため、ブラウザーで折り返します(つまり、使用したくない&lt;pre&gt;)。また、ブロックスニペットにCSS書式を設定したいと思います。 &lt;code&gt;CSSブロック属性を(を使用してdisplay: block;)配置すると、インラインスニペットが破損するため、両方を使用することはできないようです。 私は人々が何をしているのか知りたいです。&lt;code&gt;ブロックと&lt;samp&gt;インラインに使用しますか?使用&lt;code&gt;&lt;blockquote&gt;または同様のもの? 他のユーザーがHTMLを保守するため、実際のHTMLはできるだけシンプルにして、クラスは避けたいと思います。


12
CSS / HTML:テキストをイタリックにする正しい方法は何ですか?
テキストをイタリックにする正しい方法は何ですか?私は次の4つのアプローチを見てきました。 &lt;i&gt;Italic Text&lt;/i&gt; &lt;em&gt;Italic Text&lt;/em&gt; &lt;span class="italic"&gt;Italic Text&lt;/span&gt; &lt;span class="footnote"&gt;Italic Text&lt;/span&gt; &lt;i&gt; これは「古い方法」です。&lt;i&gt;意味的な意味はなく、テキストをイタリックにすることの表現効果のみを伝えます。私の知る限り、これは非セマンティックなので、明らかに間違っています。 &lt;em&gt; これは、純粋に表示の目的でセマンティックマークアップを使用します。たまたま、&lt;em&gt;デフォルトではテキストをイタリックで表示するため、&lt;i&gt;回避する必要があることは知っているが、その意味的な意味を知らない人がよく使用します。強調されているため、すべての斜体テキストが斜体であるとは限りません。時々、それはサイドノートやささやきのように、正反対になることがあります。 &lt;span class="italic"&gt; これは、CSSクラスを使用してプレゼンテーションを配置します。これは正しい方法であるとしばしば宣伝されていますが、これも私には間違っているようです。これは、それ以上の意味的な意味を伝えているようには見えません&lt;i&gt;。しかし、その支持者は泣き叫ぶ。もしあなたがそれを大胆にしたかったなら、後であなたのすべてのイタリック体のテキストを変更する方がはるかに簡単です。しかし、そうではありません。テキストを太字にした「italic」というクラスが残ってしまうからです。さらに、なぜウェブサイトのすべての斜体テキストを変更したいのか、少なくともこれが望ましくない、または必要でない場合を考えることができる理由は明らかではありません。 &lt;span class="footnote"&gt; これは、セマンティクスにCSSクラスを使用します。これまでのところこれが最善の方法のようですが、実際には2つの問題があります。 すべてのテキストがセマンティックマークアップを保証するのに十分な意味を持つわけではありません。たとえば、ページの下部にある斜体のテキストは本当に脚注ですか?それとも余談ですか?または完全に別の何か。おそらく、特別な意味はなく、イタリック体でレンダリングして、前のテキストからプレゼンテーションを区別するだけです。 意味的な意味は、十分な強度がない場合に変わる可能性があります。ページの一番下にあるテキストだけに基づいて「脚注」に沿ったとしましょう。数か月後に下部にテキストを追加したい場合はどうなりますか?もはや脚注ではありません。どのようにして&lt;em&gt;これらよりも一般的ではないがこれらの問題を回避するセマンティッククラスを選択できますか? 概要 イタリック体を作成したいという欲求がセマンティックな意味を持たせることを意図していない多くの場合、セマンティクスの要件は非常に負担になるようです。 さらに、スタイルと構造を分離したいという欲求により、CSS &lt;i&gt;は、実際にはあまり役に立たない場合があるときの代わりとして宣伝されてきました。だから、これは私に謙虚な&lt;i&gt;タグを残し、この一連の考え方がHTML5仕様に残されている理由であるかどうか疑問に思いますか? このテーマについての良いブログ投稿や記事はありますか?おそらく、&lt;i&gt;タグを保持/作成する決定に関与した人々によるのでしょうか?

4
<a>(アンカータグ)をhref属性なしで使用できますか?
私はTwitter Bootstrapを使用してサイトを構築してきました。その機能の多くは、&lt;a&gt;JavaScriptを実行するだけの場合でも、でのラップに依存しています。href="#"Bootstrapのドキュメントで推奨されている戦術に問題があったため、別の解決策を見つけようとしました。 ただし、href属性を完全に削除してみました。私はを使用しており&lt;a class='bunch of classes' data-whatever='data'&gt;、残りはJavascriptで処理します。そしてそれは機能します。 それでも、私がこれをしてはいけないことを何かが教えてくれています。正しい?つまり、技術的に&lt;a&gt;は何かへのリンクであることになっていますが、これが問題である理由は完全にはわかりません。またはそれは?

9
TD内のDIVは悪い考えですか?
私はどこかで&lt;div&gt;内部がノーノーであると聞いた/読んだよう&lt;td&gt;です。それが機能しないわけではなく、ディスプレイのタイプに基づいて実際に互換性がないということだけです。私の直感を裏付ける証拠が見つからないので、私は完全に間違っているかもしれません。



8
著者の名前をマークアップするには、どのHTML5タグを使用すればよいですか?
たとえば、ブログの投稿や記事です。 &lt;article&gt; &lt;h1&gt;header&lt;h1&gt; &lt;time&gt;09-02-2011&lt;/time&gt; &lt;author&gt;John&lt;/author&gt; My article.... &lt;/article&gt; しかし、authorタグは存在しません...では、作者が一般的に使用するHTML5タグは何ですか?ありがとう。 (存在しない場合、存在すべきではありませんか?)

5
垂直ヘッダーのあるHTMLテーブルを作成する最も一般的な方法は?
こんにちは、私が何かを尋ねてからしばらく経ちました。これはしばらくの間私を悩ませてきたものです。質問自体はタイトルにあります: 垂直方向のヘッダーを持つHTMLテーブルを作成するための好ましい方法は何ですか? 垂直ヘッダーとは、テーブル&lt;th&gt;の左側に(一般的に)ヘッダー()タグがあることを意味します ヘッダー1データデータデータ ヘッダー2データデータデータ ヘッダー3データデータデータ 彼らはこのように見えます、これまでのところ私は2つのオプションを考え出しました 最初のオプション &lt;table id="vertical-1"&gt; &lt;caption&gt;First Way&lt;/caption&gt; &lt;tr&gt; &lt;th&gt;Header 1&lt;/th&gt; &lt;td&gt;data&lt;/td&gt;&lt;td&gt;data&lt;/td&gt;&lt;td&gt;data&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;th&gt;Header 2&lt;/th&gt; &lt;td&gt;data&lt;/td&gt;&lt;td&gt;data&lt;/td&gt;&lt;td&gt;data&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;th&gt;Header 2&lt;/th&gt; &lt;td&gt;data&lt;/td&gt;&lt;td&gt;data&lt;/td&gt;&lt;td&gt;data&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; この方法の主な利点は、それが表すデータの隣にヘッダーが右(実際には左)にあることです。ただし、私が好きでないの&lt;thead&gt;は&lt;tbody&gt;、&lt;tfoot&gt;タグとタグが欠落していることです。 nicellyが要素を一緒に配置したため、2番目のオプションに移動しました。 2番目のオプション &lt;style type="text/css"&gt; #vertical-2 thead,#vertical-2 tbody{ display:inline-block; } &lt;/style&gt; &lt;table id="vertical-2"&gt; &lt;caption&gt;Second Way&lt;/caption&gt; &lt;thead&gt; &lt;tr&gt; &lt;th colspan="3"&gt;Header 1&lt;/th&gt; &lt;/tr&gt; &lt;tr&gt; …

10
FORM内でDIVを使用するのは正しいですか?
FORMタグ内のDIVタグについてどう思いますか? 私はこのようなものが必要です: &lt;form&gt; &lt;input type="text"/&gt; &lt;div&gt; some &lt;/div&gt; &lt;div&gt; another &lt;/div&gt; &lt;input type="text" /&gt; &lt;/form&gt; DIV内部で使用するのが一般的な習慣FORMですか、それとも別のものが必要ですか?

8
HTMLでリストのキャプション、タイトル、またはラベルを意味的に提供する方法
HTMLリストにセマンティックキャプションを提供する適切な方法は何ですか?たとえば、次のリストには「タイトル」/「キャプション」があります。 フルーツ 林檎 梨 オレンジ 「果物」という単語は、リスト自体に意味的に関連付けられるように、どのように処理する必要がありますか?
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.