ホームページ >ウェブフロントエンド >htmlチュートリアル >HTMLのコメントと色(色名、16進数)を詳しく解説

HTMLのコメントと色(色名、16進数)を詳しく解説

青灯夜游
青灯夜游オリジナル
2022-08-02 19:05:283246ブラウズ

この記事では、HTML コメントと色について説明し、一般的に使用される色の名前と 16 進値をいくつか紹介します。皆さんのお役に立てれば幸いです。

HTMLのコメントと色(色名、16進数)を詳しく解説

1. HTML コメント (例付き)

HTML コメントは主に、コードは説明されており、コメントもコードの一部ですが、ブラウザはコメントの内容を自動的に無視するため、ユーザーは Web ページ上のコメントを見ることができません。

完全な HTML ドキュメントは多くの場合、数百行または数千行のコードで構成されており、その特定の部分を変更する場合には長い時間がかかる可能性があるため、コードを記述するときはコメントを有効に活用する必要があります。 . そうすることで初めて、変更したい場所が見つかります。コメントの場合は異なります。関数やその他の条件に応じてプログラムをいくつかの部分に分割し、コメントを付けることで、自分や他の人がコードを読みやすくなり、コードの可読性が向上します。

単一行コメント

HTML では、<!-- --> を使用してコードにコメントを追加できます、<!-- および - -> ; の間にあるものはすべてコメントとして扱われます。サンプル コードは次のとおりです。

<!DOCTYPE html>
<html>
<!-- head 开始 -->
<head>
    <meta charset="UTF-8">  <!-- 当前文档采用UTF-8编码 -->
    <title>HTML注释的写法</title>
</head>
<!-- head 结束 -->
<!-- body 开始 -->
<body>
    <!-- 一段文本 -->
    <p>欢迎来到PHP中文网</p>
</body>
<!-- body 结束 -->
</html>

コメントは、ドキュメントの先頭、ドキュメントの末尾、ドキュメントの途中、タグの外側、ドキュメント内など、HTML ドキュメント内のどこにでも表示できます。タグの内容など。

複数行のコメント

これまでは主に 1 行のコメントについて説明しましたが、HTML では複数行のコメントもサポートされています。複数行のコメントと単一行のコメントの違いは大きくありません。コメントの内容が <!---->## の間にあることを確認するだけで済みます。 #、以下に示すように :

<!--
    多行注释
-->

コメントは、コードの説明に加えて、プログラム内のコードに注釈を付けるためにも使用できます。たとえば、特定のコードを実行したくない場合などです。 、最初にコメントアウトして、ブラウザーがこのコードは実行されないようにすることができます。

IE 条件付きコメント

条件付きコメントは、Windows システム上の Internet Explorer (IE) ブラウザでのみ有効であり、他のブラウザでは無視されます。 IE5 以降、条件付きコメントがサポートされており、条件付きコメントを使用して、IE ブラウザを使用しているユーザーに指示を与えることができます。以下に示すように:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>IE浏览器条件注释</title>
</head>
<body>
<h4>根据不同的 IE 版本显示不同的内容</h4>
<!-- 如果使用 IE,则显示 -->
    <!--[if IE]>
        <p>您正在使用IE浏览器</p>
    <![endif]-->
    <!-- 如果使用 IE8,则显示 -->
    <!--[if IE 8]>
        <p>您正在使用 IE8</p>
    <![endif]-->
    <!-- 如果不是使用 IE7,则显示 -->
    <!--[if !IE 7]>
        <p>您使用的不是 IE7</p>
    <![endif]-->
    <!-- 如果版本小于 IE10,则显示 -->
    <!--[if lt IE 10]>
        <p>您正在使用 IE10 以下的版本</p>
    <![endif]-->
    <!-- 如果版本大于等于 IE6,则显示 -->
    <!--[if gte IE 6]>
        <p>您正在使用 IE6 及其以上的版本</p>
    <![endif]-->
</body>
</html>

IE8 での実行効果:

HTMLのコメントと色(色名、16進数)を詳しく解説

Chrome ブラウザでの実行効果:

HTMLのコメントと色(色名、16進数)を詳しく解説#条件付きコメントにより、現在のブラウザが IE であるかどうかと IE のバージョンを検出でき、開発者は異なる IE ブラウザに応じて異なるスタイル シートや JS スクリプトを読み込むことができます。

IE のバージョンを比較するには、次のキーワードを使用します。

    lt: 「未満」の省略形で、「未満」を意味します。
  • lte:less than or equal toの略で、以下という意味です。
  • gt:「より大きい」を意味する「greater than」の略語。
  • gte:「以上」を意味する「greater than or equal to」の略語。
  • !:
  • と等しくない IE ブラウザは HTML5 のサポートにあまり対応しておらず、以前のバージョンの動作はさらに奇妙です。IE市場では、大手インターネット企業が IE と互換性を持たなくなり、開発プロセス中に誰もが IE に注目する必要がなくなりました。

2. HTML カラー値の設定HTML カラーは、赤、緑、青の混合です。

1. すべてのブラウザはカラー名セットをサポートしており、カラー値は RGB 形式のキーワードまたは数値であり、Web ページの途中でよく使用されます。

2. 色の値として英単語を使用します:

    赤 red | 緑 | 青 | ピンク | 紫など。
  • 3. 6 桁の 16 進数のカラー値:

    ff0000 省略形: #f00
  • 最初の 2 桁は赤を表し、中間の 2 桁は赤を表します。色は緑で、最後の 2 桁は青を表します。
  • 色の名前または 16 進数値をクリックすると、さまざまなテキストの色に一致する背景色が表示されます。
アクア#00FFFFアクアマリン#7FFFD4Azure #F0FFFFベージュ#F5F5DCビスク#FFE4C4ブラック#000000#ブランチアーモンド#FFEBCDブルー#ブラウン#A52A2Aバーリーウッド#DEB887 CadetBlue#5F9EA0Chartreuse#7FFF00チョコレート##D2691E#FF7F50#6495ED#DarkCyan#008B8B##DarkGoldenRod#ダークグレー##ダークグリーン#ダークカーキダークマゼンタ#ダークオリーブグリーン#ダークサーモン##E9967Aダークシーグリーン#8FBC8F##DarkSlateBlue#483D8B#2F4F4F##FFFAF0#フォレストグリーン#フクシアゲインズボロ GhostWhiteGoldゴールデンロッド#インディアンレッド #CD5C5C インディゴ アイボリーカーキラベンダーラベンダーブラッシュLawnGreenレモンシフォン#ライトブルーLightCoralライトシアン##90EE90#FFB6C1#FFA07A#20B2AA#87CEFA# # #石灰綠#32CD32##亞麻 ##洋紅色 ##栗子  中藍色#0000CD #BA55D3 #9370DB  ##MediumSlateBlue#7B68EE#中春綠##00FA9A#  #FFE4B5納瓦霍懷特#FFDEAD#海軍 # ##Olive##808000  6B8E23 #FFA500FF4500## ##粉紅藍色#B0E0E6##紫色 紅色#FF0000玫瑰色棕色BC8F8FRoyalBlue#4169E1#「馬鞍棕色#8B4513鮭魚##FA8072#SandyBrown#F4A460##海綠# 2E8B57#SeaShell##FFF5EE #Norena#A0522D銀色##C0C0C0 ## ## ##SlateGray##708090##   ##Thistle ##D8BFD8#Tomato#FF6347Turquoise##40E0D0#Violet#EE82EEWheat#F5DEB3#White#FFFFFFWhiteSmoke#F5F5F5Yellow#FFFF00
色の名前 HEX カラー
アリスブルー #F0F8FF
AntiqueWhite ##FAEBD7
##0000FF ##ブルーバイオレット
#8A2BE2
コーラル
コーンフラワーブルー
コーンシルク FFF8DC
##クリムゾン DC143C
#シアン #00FFFF
##ダークブルー ##00008B
#B8​​860B
#A9A9A9
#006400
BDB76B
8B008B
#556B2F ## DarkOrange
#FF8C00 #DarkOrchid
#9932CC #ダークレッド
##8B0000
##DarkSlateGray
ダークターコイズ #00CED1
ダークバイオレット #9400D3
ディープピンク #FF1493
ディープスカイブルー #00BFFF
DimGray #696969
#ドジャーブルー #1E90FF
FireBrick #B22222
FloralWhite
#228B22
#FF00FF
#DCDCDC
#F8F8FF
#FFD700
##DAA520 グレー
#808080
#008000 緑黄
#ADFF2F ハニーデュー
#F0FFF0# ######## ###############ホトピンク### ##FF69B4
##4B0082
#FFFFF0
#F0E68C
#E6E6FA
##FFF0F5
#7CFC00
#FFFACD
#ADD8E6
# F08080
##E0FFFF ライトゴールデンロッドイエロー
#FAFAD2 ライトグレー
#D3D3D3 ライトグリーン
#ライトピンク
#ライトサーモン
ライトシーグリーン
ライトスカイブルー
 
##LightSlateGray  #778899
#淺鋼藍  #B0C4DE
##淺黃色  #FFFFE0
  #00FF00## 
   
#FAF0E6
#FF00FF
#800000 ##  #MediumAquaMarine
##66CDAA##   
##中蘭花
#中紫色
  ##中海綠
#3CB371  
########################################。 ################# #####中綠松石### ##########48D1CC########## # ##############中紫羅蘭色### # #########C71585########## ########### ####午夜藍### ##########191970# ##  
##薄荷奶油 #F5FFFA
#MistyRose  #FFE4E1
莫卡辛
 
   
# 000080
OldLace  #FDF5E6
OliveDrab
##  橘紅色 
##蘭花 #DA70D6
################################ ########淡金棒### ##########EEE8AA######### ###############白綠### ####### ###98FB98######## ##############淡綠松石色### ######## ###AFEEEE######## #################淡紫紅色##############DB7093#### ################ ######木瓜鞭### ##########FFEFD5########## ## ##############PeachPuff### # #########FFDAB9######### ############################# #秘魯### ##########CD853F#### ##########CD853F#### ##########CD853F############## #FFC0CB
#梅 DDA0DD
 
#800080
 
 
   
 
   
 
 
 
 
##天藍色 #87CEEB
#SlateBlue #6A5ACD
# ###### ########雪### ##########FFFAFA######### #### ############春綠# ############00FF7F###  
SteelBlue  #4682B4
Tan  #D2B48C
Teal   #008080
   
 
   
 
 
   
   
   

YellowGreenHTMLのコメントと色(色名、16進数)を詳しく解説 

#9ACD32

#### ##################Web安全色##### ####數年以前,當大多數電腦只支援256 種顏色的時候,一系列216 種Web 安全色作為Web 標準被建議使用。其中的原因是,微軟和 Mac 作業系統使用了 40 種不同的保留的固定係統顏色(雙方大約各使用 20 種)。 ######我們不確定如今這麼做的意義有多大,因為越來越多的電腦有能力處理數百萬種顏色,不過做選擇還是你自己。 ######最初,216 跨平台 web 安全色被用來確保:當電腦使用 256 色調色板時,所有的電腦能夠正確地顯示所有的顏色。 ###############相關推薦:《###html影片教學###》###

以上がHTMLのコメントと色(色名、16進数)を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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