このセクションは、テキストの詳細な変更から始まり、読者はHTMLのさまざまなフォント形式の変更を把握し、よりプロフェッショナルなWebページを作成できます。
4.2多様化されたテキストの変更前のセクションでは、大きな段落のさまざまな設定を学びました。これは、テキスト自体にとってより魅力的であると思われました。このセクションは、テキストの詳細な変更から始まり、読者はHTMLのさまざまなフォント形式の変更を把握し、よりプロフェッショナルなWebページを作成できます。
4.2.1テキストスタイル設定の基本ラベル - <Font>フォントスタイルを設定するための基本タグは<font> </font>であり、そこに含まれるテキストはスタイルアクション領域です。初心者向けのHTMLコードの執筆では、<font> </font>は、<font属性1 =値1> <font属性2 =値2>テキスト</font> </font>などの複数のソースによって簡単にネストされます。別の状況は、<font> <p>テキスト</font> </p>などのネストの不整合をラベル付けすることです。コードの執筆を標準化し、不必要な間違いを避けるためには、読者は学習する際に注意する必要があります。
4.2.2テキストの色を設定します色は、テキスト色の設定に使用される<font> </font>タグの属性の1つです。 font_color.htmという名前のd:/ web/ディレクトリでWebページファイルを作成し、コード4.7に示すようにコードを書きます。
コード4.7フォント色の設定:font_color.htm
<html>
<head>
<title>フォントカラー設定</title>
</head>
<body>
ライトレッドテキスト:<font color =#dd0000> HTML学習の本質は、それが必要なものを使用することです< /font> <br />
クリムゾンテキスト:<font color =#660000> HTML学習の本質は、< /font> <br />を使用することです。
ライトグリーンテキスト:<font color =#00DD00> HTML学習の本質は、それが必要なものを使用することです< /font> <br />
ダークグリーンテキスト:<font color =#006600> HTML学習の本質は、それが必要なものを使用することです< /font> <br />
ライトブルーテキスト:<font color =#0000DD> HTML学習の本質は、それが必要なものを使用することです< /font> <br />
ダークブルーテキスト:<font color =#000066> HTML学習の本質は、それが必要なものを使用することです< /font> <br />
照明黄色のテキスト:<font color =#dddd00> HTML学習の本質は、それがあらゆるものを使用することです< /font> <br />
ダークイエローテキスト:<font color =#666600> HTML学習の本質は、それが必要なものを使用することです< /font> <br />
ライトシアンテキスト:<font color =#00DDDD> HTML学習の本質は、それがあらゆるものを使用することです< /font> <br />
ダークブルーテキスト:<font color =#006666> HTML学習の本質は、それが必要なものを使用することです< /font> <br />
ライトパープルテキスト:<font color =#dd00dd> HTML学習の本質は、それが必要なものを使用することです< /font> <br />
ディープパープルテキスト:<font color =#660066> HTML学習の本質は、< /font> <br />を使用することです。
</body>
</html>
ブラウザアドレスバーにhttp://localhost/font_color.htmを入力し、閲覧効果を図4.7に示します。
図4.7フォントカラー設定
読者は、コード4.7のフォントタグで色属性がどのように使用されるかを学ぶだけでなく、さまざまな色の表現方法にも精通することができます。
4.2.3テキストのサイズを設定しますサイズは、テキストサイズの設定に使用される<font> </font>タグのプロパティでもあります。サイズの値は1〜7で、デフォルトは3です。サイズ属性値の前に +および - 文字を追加して、フォントサイズの初期値に対する増分または減少を指定できます。 font_size.htmという名前のd:/ web/ディレクトリでWebページファイルを作成し、コード4.8に示すようにコードを書きます。
コード4.8フォントサイズの設定:font_size.htm
<html>
<head>
<title>フォントサイズ設定</title>
</head>
<body>
サイズは1:<font size = 1> html学習< /font> <br />
サイズは2:<font size = 2> html学習< /font> <br />
サイズは3:<font size = 3> html学習< /font> <br />
サイズは4:<font size = 4> html学習< /font> <br />
サイズは5:<font size = 5> html学習< /font> <br />
サイズは6:<font size = 6> html学習< /font> <br />
サイズは7:<font size = 7> html学習< /font> <br />
</body>
</html>
ブラウザアドレスバーにhttp://localhost/font_size.htmを入力すると、閲覧効果を図4.8に示します。
図4.8フォントサイズの設定
読者は、サイズの値の前に +および - 文字を追加して、テキストサイズをより柔軟に設定しようとすることができます。
4.2.4テキストのフォントを設定しますフェイスは、<font> </font>タグのプロパティでもあり、テキストフォント(フォント)の設定に使用されます。 HTML Webページに表示されるフォントはブラウジングシステムから呼び出されているため、フォントを一貫性に保つためにソングフォントを使用することをお勧めし、HTMLページもデフォルトではSong Fontを使用します。 font_face.htmという名前のd:/ web/ディレクトリでWebページファイルを作成し、コード4.9に示すようにコードを書きます。
コード4.9フォントフォント設定:font_face.htm
<html>
<head>
<title>フォントフォント設定</title>
</head>
<body>
フォントはソングフォントです:<font size = 5> qinyuanchun・changsha-mao zedong < /font> <br />
フォントはカイシにあります:<font size = 5> qinyuanchun・changsha-mao zedong < /font> <br />
フォントは太字です:<font size = 5> qinyuanchun・changsha-mao zedong < /font> <br />
フォントはlishuです:<font size = 5> qinyuanchun・changsha-mao zedong </font>
</body>
</html>
ブラウザアドレスバーにhttp://localhost/font_face.htmを入力すると、閲覧効果を図4.9に示します。
図4.9フォント設定
著者は、変更されたフォントのテキストサイズをNo. 5に設定して、読者が表示されます。
4.2.5テキストを傾けますダブルタグを使用する<i> </i>は、適用するテキストを傾けることができ、記事の日付などの特殊効果を達成できます。 <em> </em>は強調タグと呼ばれ、イタリック化されています。現在、<i> </i>タグよりも頻繁に使用されています。ライティング方法は次のとおりです。
<i>これは斜体のテキスト</i>です
<em>これも斜体です</em>です
4.2.6テキストを太字にしますダブルタグを使用する<b> </b>は、適用されるテキストを太字にすることができ、記事のタイトル部分など、テキストがより目を引くようにすることができます。 <strong> </strong>はラベルに特別な重点と呼ばれ、テキストでも大胆です。現在、<b> </b>タグよりも頻繁に使用されています。ライティング方法は次のとおりです。
<b>これは太字です</b>
<strong>これは大胆なテキストでもあります</strong>
4.2.7テキストに下線を付けますダブルタグ<u> </u>を使用して、適用されたテキストにアンダースコアを追加します。以下は、テキストの傾きの包括的な例であり、大胆で下線が引かれています。 font_style.htmという名前のd:/ web/ディレクトリにWebページファイルを作成し、コード4.10に示すようにコードを書きます。
コード4.10テキスト変更設定:font_style.htm
<html>
<head>
<Title>フォント変更設定</title>
</head>
<body>
<font size = 5> italics:<em> qinyuanchun・changsha-mao zedong < /em> <br />
太字:<strong> qinyuanchun・changsha-mao zedong < /strong> <br />
下線:<u> qinyuanchun・changsha-mao zedong < /u> <br />
イタリックの太字の下線:<em> <strong> <u> qinyuanchun・changsha-mao zedong </u> </strong> </em> </font>
</body>
</html>
ブラウザアドレスバーにhttp://localhost/font_style.htmを入力し、閲覧効果を図4.10に示します。
図4.10フォント変更設定
著者は、読者が表示するために、すべてのテキストサイズを<body> </body>に5番に設定します。
- 注:複数のタグに同じテキストが含まれている場合、包含順序を誤って調整することはできません。
4.2.8複数のタイトルスタイルの使用Web記事では、タイトルの重要性を強調するために、タイトルのスタイルは比較的特別です。 HTMLテクノロジーは、タイトルのスタイルタグのセットを保護します。つまり、ダブルタグ<h1>〜<h6>であり、テキストサイズは大部分から小までさまざまなレベルのタイトルを表しています。タイトルタグには機能があり、1つの行に限定され、テキストには太字、テキストの中心があります。このようにして、タイトルを簡単に設定でき、マルチレベルのタイトルを設定できます。 font_h.htmという名前のd:/ web/ディレクトリでWebページファイルを作成し、コード4.11に示すようにコードを書きます。
コード4.11タイトル設定:font_h.htm
<html>
<head>
<title>タイトル設定</title>
</head>
<body>
<h1>タイトル番号1 </h1>
<h2>タイトル番号2 </h2>
<h3>タイトル番号3 </h3>
<h4>タイトル番号4 </h4>
<h5>タイトル番号5 </h5>
<h6>タイトル番号6 </h6>
<h1>フォーチュンマガジン:Googleが繁栄の後に落ちないのはなぜですか?</h1>
<h3>潜在的な問題に遭遇します</h3>
<p>&nbsp;&nbsp;&nbsp;&nbsp;一部の業界関係者は、インターネット検索と広告市場の長期的な独占の後、Googleが減少する可能性があると考えています。 ...同時に、Open Mobile Alliance、ソーシャルネットワーキングWebサイトOpensocialのユニバーサルプラットフォーム、ワイヤレス周波数帯域への入札に数十億ドルの投資の可能性など、Googleの最近の新しい計画も広く疑問視されています。
<h3>は、検索の独占を継続します</h3>
<p>&nbsp;&nbsp;&nbsp;&nbsp;最近の記事では、より良い検索エンジンが現れた場合、人々はためらうことなくGoogleをあきらめると述べています。しかし、たとえ非常に優れた検索エンジンがあったとしても、Googleはしばらくの間しばらくしっかりと耐えることができます。 ...この場合、ウェブサイトの速度が結果の鍵になることがよくあります。 </p>
</body>
</html>
ブラウザアドレスバーにhttp://localhost/font_h.htmを入力すると、閲覧効果を図4.11に示します。
図4.11タイトル設定
4.2.9 Webページで特殊文字を処理することを学びますHTMLでは、<and>はタグの左側と近接括弧であるなど、特別な意味を持ち、タグはHTMLの表示を制御します。タグ自体はブラウザでのみ解析でき、ページに表示することはできません。では、htmlに<and>を表示する方法は? HTMLは、表4.1に示すように、Webページに表示されるいくつかの特殊文字を書く方法を指定しています。
表4.1 HTMLの特殊文字
特別なシンボル
HTMLコード
特別なシンボル
HTMLコード
<
&lt;
™(商標記号)
&貿易;
>
&gt;
®(記録シンボル)
&reg;
(英語の半幅)
&quot;
×
&Times;
§
&宗派;
©(著作権記号)
&コピー;
string.htmという名前のd:/ web/ディレクトリでWebページファイルを作成し、コード4.12に示すようにstring.htmコードを書き込みます。
コード4.12特殊文字の設定:string.htm
<html>
<head>
<title>特殊文字の設定</title>
</head>
<body>
<フォントサイズ= 5>
タグの表示方法:&lt; html&gt; <br />
引用を表示する方法:「英語の半幅の二重引用符」<br />
商標ディスプレイ方法:&trade; <br />
登録記号を表示する方法:&reg; <br />
著作権記号を表示する方法:&コピー; <br />
show&sect; <br />
ショー&タイムズ;
</font>
</body>
</html>
ブラウザアドレスバーにhttp://localhost/string.htmを入力すると、閲覧効果を図4.12に示します。
図4.12特殊文字の設定
- 説明:シンボルを個別に表示する必要があり、Code&amp;で使用する必要があります。
4.2.10いくつかのHTMLのブラウザ解析をより便利に無視する方法Webページでこの本に似たHTMLコードの例を作成する場合、すべてを<and>に変換する必要がある場合があります。そして、それはもっと面倒に思えます。 HTMLコードの<Plaintext>および<xmp> </xmp>は、この問題を簡単に解決できます。
<Plaintext>は単一のタグです。 HTMLコードに挿入されると、すべてのHTMLタグが無効になります。つまり、ブラウザは<Plaintext>の後にすべてのHTMLタグを解析せず、ページに直接表示します。
<xmp> </xmp>はダブルタグであり、含まれるコンテンツのタグを無効にするだけで、<xmp> </xmp>の使用がより一般的です。 html.htmという名前のd:/ web/ディレクトリでWebページファイルを作成し、コード4.13に示すようにコードを書きます。
コード4.13タグの設定:html.htm
<html>
<head>
<Title>タグの設定を無視</title>
</head>
<body>
<h2> qinyuanchun・changsha </h2>
寒い秋とは独立して、<strong>オレンジ島の頭であるXiangjiang川の北に行く。 <br />赤い山を見て、森が染色されています。 <br />川は緑で透明で、何百ものボートが流れのために競います。 </u> <br/> </xmp>
イーグルスは空を攻撃し、魚が浅い底で泳ぎ、あらゆる種類の種が霜の空で自由を求めて競います。 <br />私が広大な土地について悲しいとき、誰が浮き沈みを担当しますか? <br />
<Plaintext>
私は何百ものカップルを旅行に連れてきて、過去の輝かしい年を思い出しました。 <br />クラスメートは若いです。 <br />学者は熱意と勇気に満ちています。 <br />国を伝えて言葉を刺激します。<br />汚れの肥料は当時1万世帯でした。 <br />真ん中で水にぶつかると、波が飛ぶボートが止まることを思い出したことがありますか?
</body>
</html>
ブラウザアドレスバーにhttp://localhost/string.htmを入力すると、閲覧効果を図4.13に示します。
図4.13タグの設定を無視します
4.2.11その他のテキスト変更方法さまざまなフィールドのニーズを満たすために、HTMLにはテキストを変更する他のタグがあります。最も一般的に使用されるものは、SuperScript形式のラベルと添え字形式のラベルです。場合によっては、削除効果を使用する必要があり、HTMLミッドスクリプトタグを使用できます。
- SuperScript形式のタグはDouble Tag <Sup> </sup>であり、これは主に特定の数の正方形や立方メートルなどの数学的指数を表すために使用されます。
- 添え字形式のラベルは二重ラベル<sub> </sub>であり、これは主に注釈と数学の基本表現に使用されます。
- ミッドスコアラベルはダブルラベル<strike> </strike>であり、これは主に削除効果に使用されます。
other.htmという名前のd:/ web/ディレクトリでWebページファイルを作成し、コード4.14に示すようにコードを書きます。
コード4.14その他の変更タグ設定:other.htm
<html>
<head>
<title>タグを変更するためのその他の設定</title>
</head>
<body>
<フォントサイズ= 5>
qinyuanchun <sup> changsha </sup>! <br />
数学指数の表現:2 <Sup> 3 < /sup> = 8、100 <Sup> 2 < /sup> = 10000 <br /> <hr />
qinyuanchun <sub> changsha </sub>! <br />
数学的基本番号の表現:log <sub> 3 < /sub> 81 = 4、log <sub> 5 < /sub> 125 = 3 <br /> <hr />
削除効果:<strike>削除されました</strike>
</font>
</body>
</html>
ブラウザアドレスバーにhttp://localhost/other.htmを入力すると、閲覧効果を図4.14に示します。
図4.14他の変更タグの設定