ホームページ >ウェブフロントエンド >htmlチュートリアル >第 3 章 テキスト要素_html/css_WEB-ITnose

第 3 章 テキスト要素_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:19:501259ブラウズ

学習ポイント:

1. テキスト要素の概要

2. テキスト要素の分析

講師: Li Yanhui

この章では、いわゆる HTML5 のテキスト要素について主に説明します。テキスト要素構造と意味が一致するようにテキスト セットを変換することです。

1つ。テキスト要素の概要

HTML5 仕様では、要素の使用は要素のセマンティクスに完全に基づいて行われるべきであると述べられています。ただし、歴史的な遺産とユーザー第一の原則により、このセマンティクスははるかに緩やかになります。

要素名説明aハイパーリンクを生成br 強制改行wbr安全な改行 b 強調せずにテキストの一部にマークを付けます 強い は重要を意味します i は外国語または科学を意味します用語em は強調を意味します code はコンピュータコードを意味します var はプログラム出力を意味します samp は変数を表します kdb はユーザー入力を表します abbr は略語を表しますciteは他の作品のタイトルを示しますdel は削除されたテキストを意味しますs はテキストが確認されなくなったことを意味します dfn は用語定義を意味します マーク は、別のコンテキストに関連するコンテンツを意味します q は、他の場所から引用されたコンテンツを意味します

rpはruby要素と組み合わせて使用​​されます、括弧 rt は、ルビ要素と組み合わせて使用​​されます。括弧 ruby は、上にある発音記号を表します。表意文字の右側 bdoテキストの方向を制御小さいは小さいフォントコンテンツを意味しますsub は下付きフォント を意味しますsupは上付きフォントを意味しますtimeは時間または日付を意味しますu 強調せずにテキストの一部をマークします スパンセマンティクスを持たない普遍的な要素。通常は CSS の変更と組み合わせます。

上の表から、テキスト要素がまだたくさんあることがわかります。しかし実際には、実際のアプリケーションでは一般的に使用されるものはほんのわずかであり、そのほとんどは英語用です。

Ⅱ。テキスト要素の分析

1.a4b561c25d9afb9ac8dc4d70affff419 はキーワードと製品名を表します

<b>HTML5</b>

説明: a4b561c25d9afb9ac8dc4d70affff419 要素の実際の機能は、太字にすることです。意味論的な観点から見ると、これはテキストの一部にマークを付けることを意味しますが、特別な強調や重要性を示すものではありません。たとえば、テキスト内の特定のキーワードや製品名などです。

2.8e99a69fbe029cd4e2b854e244eab143重要なテキストを示します

<strong>HTML5</strong>

説明: 8e99a69fbe029cd4e2b854e244eab143 要素の実際の機能は、太字にすることです。意味論的な観点から見ると、重要なテキストを強調することを意味します。

3.0c6dc11e160d3b678d68754cc175188a強制改行、37fcc81822f151c26d66e5caf9953670安全な改行

<br>Thisabc<wbr>dkedkslakdj<wbr>fkdlsakd is apple.

説明: テキスト位置に 0c6dc11e160d3b678d68754cc175188a を入力すると改行が発生します。長い場合は、977c4d734ae9c8e60bf87ec690089fb3 は外国の語彙または科学用語を表します

<i>HTML5</i>

説明: 5a8028ccc7a7e27417bff9f05adf5932 要素の実際の機能は傾斜することです。意味論的な観点から見ると、特別な強調や重要性を持たずに周囲のコンテンツを区別することを意味します。

5.907fae80ddef53131f3292ee4f81644b強調するには

説明: 907fae80ddef53131f3292ee4f81644b 要素の実際の機能は、意味的には傾斜することです。テキストの一部。

6.2e44d2d3284d23d932e1fd85f3d4cf3a は不正確または修正を意味します

<em>HTML5</em>

説明: 2e44d2d3284d23d932e1fd85f3d4cf3a の実際の機能は、意味的には不正確な削除を意味します。

7.823db3943044a0a9a620ada8d4b1d965 はテキストの削除を意味します

<s>HTML5</s>

説明: 823db3943044a0a9a620ada8d4b1d965 要素の実際の機能は、意味的には取り消し線です。文章。

8.88f336217b3880082bb52d49b5de60a5 はテキストに下線を引くことを意味します

<del>HTML5</del>

説明: 88f336217b3880082bb52d49b5de60a5 要素の実際の機能は、意味の観点から下線を追加することです。このテキストは強調されません。 。

9.426be984ffbbb815d7d88e3543a85d91テキストを追加します

<u>HTML5</u>

説明: 426be984ffbbb815d7d88e3543a85d91 要素の実際の機能は、意味上の点から下線を追加する 88f336217b3880082bb52d49b5de60a5 です。ビューでは、テキストを追加する役割を果たします。

10.d015d241ae6d34c34210679b5204fe85小さいフォントを追加します

<ins>HTML5</ins>

説明: d015d241ae6d34c34210679b5204fe85要素の実際の機能は、テキストを 1 サイズ小さくすることです。意味的には、免責事項と説明文に使用されます。

11.b96cac025db4031319c29e1eb68f19d62cdea26b4c3988e37d674b56660962a7 上付き文字と下付き文字を追加します

<small>HTML5</small>

説明: b96cac025db4031319c29e1eb68f19d6 要素と 2cdea26b4c3988e37d674b56660962a7 要素の実際の機能は、数学的な上付き文字と下付き文字です。セマンティクスについても同様です。

12.ffbe95d20f3893062224282accb13e8f は入力と出力を表します

説明: ffbe95d20f3893062224282accb13e8f はプログラミング言語の変数を表します。プログラムまたはコンピュータを表します。 はユーザー入力を表します。これは英語のカテゴリに属する​​ため、効果を反映するには英語で lang="en" を使用する必要があります。

13.8a7974376be5f6c00c121222b727adb9 は略語を表します

<sub>5</sub><sup>5</sup>

説明: 8a7974376be5f6c00c121222b727adb9 要素は意味的には実質的な効果を持ちません。

14.7f9d788ef50b059a7f76f3d2e4ccc9d1 は定義用語を表します

説明: 7f9d788ef50b059a7f76f3d2e4ccc9d1 要素は意味的には単語または語句を説明するテキストの一部を表します。

15.1244aa79a84dea840d8e55c52dc97869他の場所からのコンテンツの引用

<code>HTML5</code><var>HTML5</var><samp>HTML5</samp><kdb>HTML5</kdb>

説明: 1244aa79a84dea840d8e55c52dc97869 要素の実際の機能は、二重引用符のペアを追加することです。意味的には、他の場所から来たコンテンツを指します。

16.f3a85e1241a187c5ac462d886e9a968b他の作品のタイトルを引用します

<abbr>HTML5</abbr>

解释:f3a85e1241a187c5ac462d886e9a968b元素实际作用就是加粗。从语义上来看,表示引用其他作品的标题。

 

17.ec41f2147470148e85ad0337a362103e语言元素

<ruby>饕<rp>(</rp><rt>tāo</rt><rp>)</rp>餮<rp>(</rp><rt>ti&egrave;</rt><rp>)</rp> </ruby>

解释:ec41f2147470148e85ad0337a362103e用来为非西方语言提供支持。515718f19dfe6612658be14be18aa0ec7240f116d85a7ee375466871bc33670a用来帮助读者掌握表意语言文字正确发音。比如:汉语拼音在文字的上方。但目前 Firefox 还不支持此特性。

 

18.71af07a0e88a1ac1ff73f855702ac153设置文字方向 

<bdo dir="rtl">HTML5</bdo>

解释:71af07a0e88a1ac1ff73f855702ac153必须使用属性 dir 才可以设置,一共两个值:rtl(从右到左)和 ltr(从左到右)。一般默认是 ltr。还有一个af4e6c3c591431c4583becd75d1c3582元素也是处理方向的,由于是特殊语言的特殊效果,且主流浏览器大半不支持,忽略。

 

19.f920514e6447cf1d171079d1371f007f突出显示文本 

<mark>HTML5</mark>

解释:f920514e6447cf1d171079d1371f007f实际作用就是加上一个黄色的背景,黑色的字;从语义上来看,与上下文相关而突出的文本,用于记号。

 

20.46dd80ba616c57a652514755c74c4211表示日期和时间 

<time>2015-10-10</time>

解释:46dd80ba616c57a652514755c74c4211元素没有实际作用;从语义上来看,表示日期和时间。

 

21.45a2772a6b6107b401db3c9b82c049c2表示一般性文本 

<span>HTML5</span>

解释:45a2772a6b6107b401db3c9b82c049c2元素没有实际作用;语义上就是表示一段文本,我们经常用它来设置 CSS 等操作。

 

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。