ホームページ > 記事 > ウェブフロントエンド > HTML フォントのスタイル
HTML フォントのスタイル
- WBOYオリジナル
- 2024-09-04 16:14:25499ブラウズ
次の記事「HTML フォント スタイル」では、HTML で最も一般的に使用されるフォント スタイルの概要を説明します。 HTML はハイパーテキスト マークアップ言語として広く知られており、Web アプリケーションや Web サイトの作成に不可欠な最も重要かつ重要な言語またはスクリプトの 1 つです。すべてのタグとその他の機能がその基礎となるコンポーネントを形成するため、これは Web アプリ開発のバックボーンのようなものです。
すべてのフロントエンド開発も HTML スクリプトに基づいています。これはマークアップ タグを提供するためにのみ使用できます。これらのタグの外観と操作性を向上させるために、非常に人気のある別のライブラリである CSS (Cascading Style Sheets の略) があります。これを使用して、HTML で必要なあらゆる種類のスタイルを実装できます。フォントとスタイルは Web サイトの大部分を形成します。この記事では、HTML フォント スタイルの大部分のリストを提供します。
HTML フォント スタイル
フォントは、コンテンツの読みやすさの向上とは別に、Web サイトをよりユーザーフレンドリーにし、より多くのトラフィックを呼び込む上で重要な役割を果たします。フォントの色とフォントフェイスは、コンピュータとそれを使用しているブラウザ、および HTML によっても異なります。タグは、ウェブサイト上のテキストにスタイル、色、サイズを追加するためにも使用されます。
タグは、Web サイト上または
タグは最も一般的に使用され、Web ページの見栄えを良くするために使用できる最も重要なタグの 1 つです。開いた に続くテキスト。タグは、 によって閉じられない限り、同じように残ります。タグ。
基本的な HTML フォント スタイルのいくつかを見てみましょう:
HTML フォント スタイルに関連する基本的な機能と特性がいくつかあります。
1.フォントサイズの設定
コンテンツのフォント サイズは、size 属性を使用して設定できます。範囲の許容値は、最小値の 1 から最大値の 7 までです。どのフォント タイプでもデフォルトのサイズは 3 です。
例、
<!DOCTYPE html> <html> <head> <title>Setting Basic Font Size</title> </head> <body> <font size = "1">Font size = "1"</font><br /> <font size = "2">Font size = "2"</font><br /> <font size = "3">Font size = "3"</font><br /> <font size = "4">Font size = "4"</font><br /> <font size = "5">Font size = "5"</font><br /> <font size = "6">Font size = "6"</font><br /> <font size = "7">Font size = "7"</font> </body> </html>
2.相対フォント サイズ
相対フォント サイズは、実際に存在する現在のフォント サイズより大きいサイズがいくつあるか、小さいサイズがいくつあるかを決定および指定するために使用されます。これは次のように指定できます:
<font size = "+f"> or by writing <font size = "−f">
例、
<!DOCTYPE html> <html> <head> <title>Relative Font Size</title> </head> <body> <font size = "-1">Font size = "-1"</font><br /> <font size = "+1">Font size = "+1"</font><br /> <font size = "+2">Font size = "+2"</font><br /> <font size = "+3">Font size = "+3"</font><br /> <font size = "+4">Font size = "+4"</font> </body> </html>
3.フォントフェイスの設定
フォント サイズと相対フォント サイズの設定に続くもう 1 つのカテゴリは、フォント フェイスの設定です。これは、上にリストした属性の重要な部分を形成します。これは face 属性を使用して設定できますが、このフォント値を使用するように指定されたユーザーがシステムにこのフォントをインストールしていない場合は、そのフォントを表示できないことに常に留意する必要があります。代わりに、その特定のユーザーのコンピュータに適用されるデフォルトのフォントフェイスのみが表示されます。
例、
<!DOCTYPE html> <html> <head> <title>Font Face</title> </head> <body> <font face = "Times New Roman" size = "5">Times New Roman</font><br /> <font face = "Verdana" size = "5">Verdana</font><br /> <font face = "Comic sans MS" size =" 5">Comic Sans MS</font><br /> <font face = "WildWest" size = "5">WildWest</font><br /> <font face = "Bedrock" size = "5">Bedrock</font><br /> </body> </html>
4.代替フォントフェイスの指定
- これは、ユーザーがシステムに特定のフォントをインストールしている場合にのみ、さまざまな種類のフォント フェイスを指定するために使用されます。それ以外の場合は、デフォルトでインストールされているフォントが表示されます。フォント フェイス名をカンマで区切ってリストすることにより、複数、具体的には 2 つ以上のフォント フェイスの代替案を言及することができます。
- Web ページが読み込まれると、ブラウザーは生成される最初のフォントを表示します。提供されたフォントがシステムにインストールされていない場合は、デフォルトのフォントフェイス (Times New Roman) が正常に表示されます。
例、
<font face = "arial,helvetica"> <font face = "Lucida Calligraphy,Comic Sans MS,Lucida Console">
5.フォントの色の設定
これは、HTML フォントとスタイルのリストの重要な部分およびコンポーネントを形成するもう 1 つの属性です。このフォントでは、任意の色属性を利用して色が設定されます。指定された色の 16 進コードと色名を使用して、必要な色を要求できます。
例、
<!DOCTYPE html> <html> <head> <title>Setting Font Color</title> </head> <body> <font color = "#FF00FF">This text is in pink</font><br /> <font color = "red">This text is red</font> </body> </html> <basefont>
6. Element
- This element is specific to HTML language and is supposed to provide the webpage with a default font size, typeface, and color for all the parts and components of the documents which are not contained inside the tag.
- The tag could be easily used to override the
settings. - This tag also makes use of color, face and size attributes which will relatively support all the font settings by providing the size of a value of +1 for one size greater or -2 for two sizes smaller.
Example,
<!DOCTYPE html> <html> <head> <title>Setting Basefont Color</title> </head> <body> <basefont face = "arial, verdana, sans-serif" size = "2" color = "#ff0000"> <p>This is the page's default font.</p> <h2>Example of the <basefont> Element</h2> </body> </html>
Conclusion
HTML font and styles are among the most critical components and features that cannot be overlooked and can give a very good shape and design to your website. When we talk about the latest javascript libraries available in the market, they contain all these and several other font and styles. For the basic HTML, this still needs to be done manually. I hope you liked our article. Stay tuned to our blog for more articles like these.
以上がHTML フォントのスタイルの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。