<ul id="ja94n"></ul>

\n

Page Title<\/h1>\n \n<\/body>\n<\/html><\/pre>
html5テンプレートの構(gòu)造<\/p>
\n<\/p>HTMLテンプレートには通常、次の部分が含まれています
\n
ドキュメントタイプ宣言（またはdoctype）<\/li>\n
`<\/code>要素<\/li>\n`
`文字エンコード<\/li>\n`
`ビューポート要素<\/li>\n`
<\/code>、説明と著者<\/li>\nソーシャルカードのグラフ要素を開(kāi)く<li>\n<\/li>ファビコンとタッチアイコン<li>\n<\/li>css styleSheet link<li>\n<\/li>javaScriptファイルリンク<li>\n<\/li>\n<\/ol>ドキュメントタイプの宣言と<p>要素に加えて、上記の要素のほとんどは、HTMLテンプレートの<code><html><\/code>セクションにあります。 <code><head><\/code>\n<\/p><p>html5ドキュメントタイプステートメント<strong><\/strong>\n<\/p> HTML5テンプレートは、ドキュメントタイプの宣言または<p>doctype<em>から始める必要があります。 Doctypeは、ブラウザまたは他のパーサーにどのような種類のドキュメントを探しているかを伝える1つの方法にすぎません。 HTMLファイルの場(chǎng)合、これはHTMLの特定のバージョンとタイプを意味します。 Doctypeは、常にHTMLファイルの上部にある最初のアイテムである必要があります。何年も前に、Doctype宣言はugい混亂を覚えにくいことはありませんでした。通常は「XHTML Strict」または「HTML Transitional」と指定されていました。 <\/em>\n<\/p> html5の出現(xiàn)により、それらの理解できない迷惑なものは消えました、そして今あなたはこれだけが必要です：<p>\n<\/p>\n<pre class='brush:php;toolbar:false;'><!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n <title>HTML5 Boilerplate<\/title>\n <link rel=\"stylesheet\" href=\"styles.css\">\n<\/head>\n<body> <h1><a href="http://miracleart.cn/">国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂</a></h1>\n <h1>Page Title<\/h1>\n <??>\n<\/body>\n<\/html><\/pre>シンプルで明確です。「5」は聲明からはっきりと消えました。 Webタグの現(xiàn)在のバージョンは「HTML5」と呼ばれますが、実際には以前のHTML標(biāo)準(zhǔn)の進(jìn)化にすぎません。將來(lái)の仕様は、今日の開(kāi)発にすぎません。「HTML6」は決してないので、現(xiàn)在の狀態(tài)のWebタグは通常、単に「HTML」と呼ばれます。 <p>\n<\/p>ブラウザはWeb上の古いコンテンツをサポートする必要があるため、Doctypeに依存して、特定のドキュメントでサポートする機(jī)能をブラウザに伝えることはありません。言い換えれば、Doctypeは最新のHTML機(jī)能にページに準(zhǔn)拠していません。実際、使用されているDoctypeに関係なく、ブラウザはケースごとに機(jī)能サポートケースを決定します。実際、ページに新しいHTML5要素を使用して古いDoctypeを使用でき、ページは新しいDoctypeを使用するときと同じようにレンダリングできます。 <p>\n<\/p> <p><strong>要素<code><html><\/code> <\/strong>\n<\/p><p>要素は、HTMLファイルの上位レベル要素です。つまり、ドキュメント內(nèi)のDoctype以外のすべてが含まれています。 <code><html><\/code>要素は、<code><html><\/code>および<code><head><\/code>パーツの2つの部分に分割されます。 Webページファイル內(nèi)の他のすべてのコンテンツは、<code><body><\/code>要素內(nèi)または內(nèi)部に配置されます。次のコードには、Doctype宣言の後に配置され、<code><html><\/code>および<code><html><\/code>要素が含まれている<code><html><\/code>要素が表示されます。\n<code><head><\/code>\n<code><body><\/code><\/p>html <pre class='brush:php;toolbar:false;'><!DOCTYPE html><\/pre><p>でタグを使用する方法\n<shurte <strong><\/strong>セクションには、文書(shū)に関する重要な情報(bào)が含まれています。これは、文字エンコードやCSSファイルへのリンク、場(chǎng)合によってはJavaScriptファイルなど、エンドユーザーに表示されません。この情報(bào)は、ブラウザ、検索エンジン、スクリーンリーダーなどのマシンで使用されます。\n<\/p>\n上記の<p>…<code><head><\/code>タグの間に含まれるすべての要素は重要ですが、エンドユーザーはそれを見(jiàn)ません - <\/p>テキストを除いて、オンライン検索とブラウザのタグに表示されます。 <pre class='brush:php;toolbar:false;'><html lang=\"en\">\n <head>\n <\/head>\n <body>\n <\/body>\n<\/html><\/pre><p><strong>html <\/strong><\/p>でタグを使用する方法\n<p><code><body><\/code>セクションには、テキスト、畫(huà)像などなど、ブラウザに表示されるすべてのものが含まれています。エンドユーザーに何かを見(jiàn)せたい場(chǎng)合は、オンとオフの間に<code><body><\/code>…<code><\/body><\/code>タグ：<\/p>に配置してください。\n<pre class='brush:php;toolbar:false;'><!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n <title>HTML5 Boilerplate<\/title>\n <link rel=\"stylesheet\" href=\"styles.css\">\n<\/head>\n<body>\n <h1>Page Title<\/h1>\n <??>\n<\/body>\n<\/html><\/pre>\n<p> <img src=\"https:\/\/img.php.cn\/upload\/article\/000\/000\/000\/173897581228837.jpg\" alt=\"HTML5 Template: A Base Starter HTML Boilerplate for Any Project \" \/><\/p>\n<p> <strong><code>lang<\/code>屬性は何ですか？ <\/strong><\/p>\n上記のコード（<p>）に示すように、<code><html><\/code><code>lang<\/code>要素には<code><html lang=\"en\"><\/code>屬性が含まれている必要があります。その主な目的は、スクリーンリーダーなどの支援技術(shù)に、聲を出して読むときにそれらを発音する方法を伝えることです。（このプロパティはページの検証には必要ありませんが、ほとんどのバリデーターは、それを含めない場(chǎng)合は警告を発します。）<\/p>\n<p>上記に示す<code>lang<\/code>屬性の値は<code>en<\/code>であり、ドキュメントが英語(yǔ)で記述されていることを指定します。他のすべての話された言語(yǔ)には、フランス語(yǔ)の<code>fr<\/code>、ドイツ語(yǔ)の<code>de<\/code>、ヒンディー語(yǔ)などの値があります。（ウィキペディアで言語(yǔ)コードの完全なリストを見(jiàn)つけることができます。）<code>hi<\/code>\n<\/p><p>htmlドキュメント文字エンコード<strong><\/strong>\n<\/p>htmlドキュメント<p>セクションの最初の行は、ドキュメントの文字エンコードを定義する行です。 Webページで読む文字と記號(hào)は一連の數(shù)字として定義され、一部の文字（文字など）は多くの方法でエンコードされています。したがって、どのWebページを參照すべきかをコンピューターに伝えることは便利です。インジケータ文字エンコーディングは、バリデーターに警告を発することのないオプションの機(jī)能ですが、ほとんどのHTMLページでは推奨されます。\n<code><head><\/code>\n<\/p><pre class='brush:php;toolbar:false;'><!DOCTYPE html><\/pre>注：一部の古いブラウザが正しくエンコードされている文字を読み取ることを確認(rèn)するには、ドキュメントの最初の512文字のどこかに宣言をエンコードする文字全體を含める必要があります。また、コンテンツベースの要素の前に表示される必要があります（例の後半に表示される<p>要素など）。 <em><code><title><\/code>\n<\/em>なぜHTML5テンプレートでUTF-8文字エンコードを使用するのですか？ <\/p>\n<h3>上記の文字エンコードの例では、UTF-8文字セットを使用します。ほとんどすべての場(chǎng)合、<\/h3>はドキュメントで使用する必要がある値です。このエンコーディングは、他のエンコーディングに含まれていないさまざまな文字をカバーします。たとえば、Webで奇妙なキャラクターに遭遇した可能性があります。これは明らかにバグです。これは通常、ブラウザがドキュメントで指定された文字セットに予想される文字を見(jiàn)つけることができないためです。 <p>\n<code>utf-8<\/code>UTF-8は、世界中のさまざまな言語(yǔ)の多くのキャラクターや、多くの有用なシンボルを含む、さまざまなキャラクターをカバーしています。 World Wide Web Allianceが説明するように：<\/p>\n<p>\n<\/p>Unicodeベースのエンコーディング（UTF-8など）は複數(shù)の言語(yǔ)をサポートでき、あらゆる言語(yǔ)の混合ページとフォームに適合させることができます。その使用は、サーバー側(cè)のロジックを排除する可能性があり、それにより、各サービスページまたは各著信フォームの提出の文字エンコードを個(gè)別に決定します。これにより、多言語(yǔ)のWebサイトまたはアプリケーションの処理の複雑さが大幅に削減されます。 <blockquote><\/blockquote>\n<p>文字エンコードの完全な説明はこの記事の範(fàn)囲を超えていますが、より深く掘り下げたい場(chǎng)合は、HTML仕様で文字エンコードについて読むことができます。 <\/p>\n<p> <strong><code>X-UA-Compatible<\/code>とはどういう意味ですか？ <\/strong><\/p>\n<p>あなたは時(shí)々あなたのHTMLドキュメントの<code><head><\/code>にこの行を見(jiàn)る：<\/p>\n<pre class='brush:php;toolbar:false;'><!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n <title>HTML5 Boilerplate<\/title>\n <link rel=\"stylesheet\" href=\"styles.css\">\n<\/head>\n<body>\n <h1>Page Title<\/h1>\n <??>\n<\/body>\n<\/html><\/pre>\n<p>このメタタグにより、Web Authorsはページをレンダリングするインターネットエクスプローラーのバージョンを選択できます。インターネットエクスプローラーが主に悪いメモリになっているので、コードからこの行を安全に削除できます。（HTML5テンプレートから削除しました。）IEの古いバージョンでページが表示されると確信している場(chǎng)合は、それを含める価値があるかもしれません。このメタタグの詳細(xì)については、Microsoft Webサイトで読むことができます。 <\/p>\n<p><strong>ビューポート要素<\/strong><\/p>\n<p>ビューポート要素は、ほぼすべてのHTML5テンプレートに表示される機(jī)能です。レスポンシブなWebデザインとモバイルファーストデザインにとって非常に重要です：<\/p>\n<pre class='brush:php;toolbar:false;'><!DOCTYPE html><\/pre>\n<p>この<code><meta><\/code>要素には、名前\/値セットとして一緒に機(jī)能する2つのプロパティが含まれています。この場(chǎng)合、名前は<code>viewport<\/code>に設(shè)定され、値は<code>width=device-width, initial-scale=1<\/code>に設(shè)定されています。これはモバイルデバイスのみです。値には2つの部分があることに気付くでしょう。\n<\/p>\n<ul><li>：Webサイトに提示したいビューポートのピクセル幅。 <code>width=device-width<\/code>\n<\/li><li>：これは0.0?10.0の間の正の數(shù)字である必要があります。「1」の値は、デバイスの幅とビューポートサイズの間の1：1の比率を示します。 <code>initial-scale<\/code>\n<\/li>\n<\/ul>MDNのこれらのメタ要素プロパティの詳細(xì)については、ほとんどの場(chǎng)合、このメタ要素とその設(shè)定がモバイルファーストレスポンシブWebサイトに最適であることを知っておく必要があります。 <p>\n<\/p> <p><strong>、説明と著者<code><title><\/code><\/strong>\n<\/p>HTMLベーステンプレートの次の部分には、次の3行が含まれています。\n<p>\n<\/p><pre class='brush:php;toolbar:false;'><html lang=\"en\">\n <head>\n <\/head>\n <body>\n <\/body>\n<\/html><\/pre>ブラウザのタイトルバーに表示されるもの（たとえば、ブラウザタブの上にホバーするとき）も検索結(jié)果に表示されます。この要素は、<p>セクションの唯一の要素です。説明と著者の金屬はオプションですが、検索エンジンに重要な情報(bào)を提供します。検索結(jié)果では、上記のコード例のタイトルと説明を以下に示します。 <code><title><\/code>\n<code><head><\/code> <\/p><p>\n<img src=\"https:\/\/img.php.cn\/upload\/article\/000\/000\/000\/173897581334276.jpg\" alt=\"HTML5 Template: A Base Starter HTML Boilerplate for Any Project \" \/><\/p>に任意の數(shù)の有効な要素を配置できます。 <p>\nソーシャルカードのグラフ要素を開(kāi)く<code><head><\/code><\/p>\n上記のように、<p>すべてのメタ要素はオプションですが、多くはSEOおよびソーシャルメディアマーケティングに適しています。 HTML5テンプレートの次の部分には、これらのメタエレメントオプションの一部が含まれています。\n<strong>\n<\/strong>これらの要素は、いわゆるオープングラフプロトコルを利用しており、使用できる他の多くの要素があります。これらは、最も頻繁に使用する要素です。 Open Graph Webサイトで、利用可能なオープングラフメタオプションの完全なリストを表示できます。 <\/p><p>ここに含まれるこれらの要素は、ソーシャルメディアの投稿にリンクされたときにWebページの外観を強(qiáng)化します。たとえば、ここに含まれる5つの<code><meta><\/code>要素は、次のデータが埋め込まれたソーシャルカードに表示されます。\n<\/p>\nコンテンツのタイトル<ul><li>\n<\/li>提供されたコンテンツタイプ<li>\n<\/li>コンテンツ仕様url<li>\n<\/li>コンテンツの説明<li>\nコンテンツに関連付けられている<\/li>畫(huà)像<li>\n<\/li>\n<\/ul>ソーシャルメディアで共有されている投稿が表示されると、通常、これらのデータビットがソーシャルメディアの投稿に自動(dòng)的に追加されます。たとえば、GitHubホームページへのリンクを含めると、ツイートに次のものが表示されます。 <p>\n<\/p> <p><img src=\"https:\/\/img.php.cn\/upload\/article\/000\/000\/000\/173897581532472.jpg\" alt=\"HTML5 Template: A Base Starter HTML Boilerplate for Any Project \" \/>\n<\/p><p>ファビコンとタッチアイコン<strong> <\/strong>\n<\/p>HTML5テンプレートの次の部分には、FaviconおよびApple Touchのアイコンとして含まれるリソースを示す<p>要素が含まれています。\n<code><link><\/code>\n<\/p>Faviconは、誰(shuí)かがあなたのウェブサイトをチェックすると、ブラウザタブに表示されます。 <pre class='brush:php;toolbar:false;'><!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n <title>HTML5 Boilerplate<\/title>\n <link rel=\"stylesheet\" href=\"styles.css\">\n<\/head>\n<body>\n <h1>Page Title<\/h1>\n <??>\n<\/body>\n<\/html><\/pre>ファイルは古いブラウザで使用されており、コードに含める必要はありません。プロジェクトのrootディレクトリに<p>ファイルが含まれている限り、ブラウザは自動(dòng)的に見(jiàn)つけます。 <code>favicon.ico<\/code>ファイルは、SVGアイコンをサポートする最新のブラウザで使用されます。代わりに.pngファイルを使用することもできます。 <code>favicon.ico<\/code>\n<code>favicon.svg<\/code>最後の要素は、ユーザーのホーム畫(huà)面にページを追加するときにAppleデバイスで使用されるアイコンを參照します。 <\/p>\n<p>他のアイコンを參照するWebアプリケーションマニフェストファイルなど、追加のオプションをここに含めることができます。詳細(xì)については、このトピックに関するAndrey Sitnikの記事を読むことをお?jiǎng)幛幛筏蓼?。しかし、ここに含まれるものは、単純なHTML初心者テンプレートに十分です。 <\/p>\n<p><\/p>CSSスタイルシートとJavaScriptファイルが含まれています<p><strong>\n<\/strong> HTMLの最後の2つの重要な部分は、テンプレートを開(kāi)始することです。1つ以上のStyleSheetsと場(chǎng)合によってはJavaScriptファイルへの參照です。もちろん、両方ともオプションですが、少なくともCSSスタイルを持っていないサイトはほとんどありません。 <\/p>\n<p>htmlテンプレートにCSS styleSheetを含める<\/p>\n<h3>スタイルシートはドキュメントのどこにでも含めることができますが、通常、<\/h3>セクション：<p>に表示されます。\n<code><head><\/code>\n<\/p><pre class='brush:php;toolbar:false;'><!DOCTYPE html><\/pre>要素は、Webブラウザーを外部StyleSheetに向けて、これらのCSSスタイルをページに適用できるようにします。 <p>要素には、<code><link><\/code>屬性が必要です。過(guò)去には、通常は<code><link><\/code>屬性もありましたが、実際には必要ありませんでした。そのため、ウェブ上にそれを含む古いコードを見(jiàn)つけた場(chǎng)合、削除するだけです。 <code>rel<\/code>\n<code>stylesheet<\/code> cssリンクの最後に<code>type<\/code>クエリ文字列を追加したことに注意してください。これは完全にオプションです。これは、スタイルシートを更新してこのクエリ文字列を更新するときに便利なトリックです（たとえば、1.1または2.0に更新します）。これにより、ブラウザがCSSファイルの古いキャッシュされたコピーを破棄し、新しい1つのバージョンをロードすることが保証されるためです。 <\/p><p><code><link><\/code>要素を使用してWebページにCSSを含める必要がないことは注目に値します。 <code><style><\/code>セクション。これはレイアウトを?qū)g験する場(chǎng)合は非常に便利ですが、これらのスタイルは他のページでアクセスできないため、非効率的および\/または重複するコードになるため、アクティブサイトでは一般的にはお?jiǎng)幛幛筏蓼护蟆?<code><\/style><\/code>\n<code><head><\/code> htmlテンプレートにjavascriptファイルを含める<\/p>\n<h3> javaScriptコードは通常<\/h3><p>に渡されます\n<code><\/pre>\n ?\n <p> \n<\/body><\/code>タグ：<code><\/p><\/code>にスクリプトを埋め込みました\n<pre class='brush:php;toolbar:false;'><!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n <title>HTML5 Boilerplate<\/title>\n <link rel=\"stylesheet\" href=\"styles.css\">\n<\/head>\n<body>\n <h1>Page Title<\/h1>\n <??>\n<\/body>\n<\/html><\/pre>\n古いブラウザと新しい要素に関する<p> <strong>手順<\/strong><\/p>\n<p> html5が導(dǎo)入されたとき、<code><article><\/code>や<code><aside><\/code>などの多くの新しい要素が含まれていました。正體不明の要素のサポートは、古いブラウザーにとって大きな問(wèn)題だと思うかもしれませんが、そうではありません！ほとんどのブラウザは、実際に使用するタグを気にしません。 <code><recipe><\/code>要素（または<code><ziggy><\/code>要素）を含むHTMLドキュメントがあり、CSSが特定のスタイルをその要素に添付している場(chǎng)合、ほぼすべてのブラウザがこのようにそれを処理します。。 <\/aside> <\/article> <\/ziggy> <\/recipe><\/p>\nもちろん、そのような仮定は確認(rèn)されず、アクセシビリティの問(wèn)題があるかもしれませんが、ほとんどすべてのブラウザーで正しくレンダリングされます。例外は、インターネットエクスプローラーの古いバージョンです（つまり）。バージョン9の前に、IEは認(rèn)識(shí)されていない要素がスタイルを受信することをブロックしました。レンダリングエンジンは、これらの不思議な要素を「未知の要素」として扱うため、外観や行動(dòng)を変えることはできません。これには、想像した要素だけでなく、新しいHTML5要素を含むこれらのブラウザバージョンの開(kāi)発時(shí)に定義されていなかった要素も含まれます。 <p>\n<\/p>幸いなことに、新しい要素スタイルをサポートしていない古いブラウザは最近ではほとんど存在していません。そのため、ほとんどすべてのプロジェクトで新しいHTML要素を心配することなく安全に使用できます。 <p>\n<\/p>つまり、古いブラウザを本當(dāng)にサポートする必要がある場(chǎng)合は、John Resigが元々開(kāi)発したシンプルなJavaScriptスニペットである信頼できるHTML5 SHIVを使用できます。 Sjoerd Visscherの作品に觸発され、IEの古いバージョンで新しいHTML5要素を様式にしました。実際、これは今日は必要ありません。 Caniuse.comが示すように、HTML5要素は使用中のすべてのブラウザでサポートされています。 <p>\n<em><\/em>完全なhtml5テンプレート<\/p><p>\n<strong>これは私たちの最終的なHTML5テンプレートです - どのプロジェクトでも使用できるシンプルなテンプレート：<\/strong>\n<\/p>\n<p>このシンプルで使いやすいHTML5テンプレートコードを今日のプロジェクトに入れることができます！これに基づいて、<\/p>タグと<pre class='brush:php;toolbar:false;'><!DOCTYPE html><\/pre>タグの間に必要なものを追加できます。 <p>\n<code><body><\/code><code><\/body><\/code>結(jié)論<\/p><p><p>オンラインで多くのHTML初心者テンプレートとフレームワークがあり、既製のCSSとJavaScriptファイル、および好きなように使用および変更できる多くの事前書(shū)き込みコンテンツがあります。これは私たちの目標(biāo)ではありません。ここで提供する基本的なテンプレートには、Webページを設(shè)計(jì)する際に必要なものがすべて含まれているため、毎回ゼロから始める必要はありません。 <\/p>\n<p>最初に表示する基本的なHTMLページテンプレート、または上に表示してプロジェクトで使用して使用してください。時(shí)間が経つにつれて、あなたは頻繁に必要としない內(nèi)容があり、ここで言及していないことのいくつかが頻繁に使用していることがあることに気付くかもしれません。そのため、ワークフローに合わせてテンプレートを更新できます。 <\/p>\n<p><strong>次のステップ<\/strong><\/p>\n<p>ウェブレイアウトを次のレベルに引き上げる良い方法は、美しいWebデザインの原則、第4版を使用することです。この本は、デザインの原則を教え、<em>と<\/em>を教えて、ウェブ上でそれらを?qū)g裝する方法を示します。 2020年9月に完全に書(shū)き直され、他の場(chǎng)所で読んでいない最先端のテクノロジーが含まれています。 <\/p>\nCSSの知識(shí)を磨くために、最新のCSSプロジェクトコースでは、CSS3の最新の高度なバージョンを習(xí)得するのに役立ちます。 <p>\nそれとは別に、インタラクティブでプログラム的でリアクティブなUIを使用して、ウェブサイトまたはWebアプリケーション開(kāi)発を次のレベルに引き上げることができます。たとえば、JavaScriptとReactのSitePointの膨大なリソースを見(jiàn)てください。そして、最高の足場(chǎng)Webツールとライブラリのガイドを使用して、新しいプロジェクトをより速く開(kāi)始する方法を?qū)Wびます。または、コーディングを?qū)W習(xí)せずにWebエクスペリエンスを構(gòu)築したい場(chǎng)合は、コードレスの動(dòng)きに関するスターターガイドをお読みください。最新のコードレスツールはゲームチェンジャーです。多くの場(chǎng)合、コーディングの強(qiáng)力な代替品を提供するのに十分な力が初めてあります。 <\/p>\n<p><\/p>html5テンプレートf(wàn)aq<p>\n<strong>最後に、HTML5テンプレートコードに関するよくある質(zhì)問(wèn)に答えます。 <\/strong>\n<\/p> HTMLのテンプレートは何ですか？ <p>\n<\/p>テンプレートは、プロジェクトを開(kāi)始するたびに使用されるHTMLページテンプレートであるため、ゼロから開(kāi)始することを避けます。ドキュメントタイプの宣言や、各Webページに表示される基本的なHTML要素などの一般的な要素が含まれます。 <h3>\n<\/h3>テンプレートはテンプレートですか？ <p>\n<\/p>はい。テンプレートは、キャラクターエンコード、<h3>、<\/h3>要素、CSSおよびJavaScriptファイルなど、あらゆるWebページに表示される基本要素へのリンクを含む非常にシンプルなHTML初心者テンプレートです。 <p>\n<code><head><\/code>HTMLでテンプレートを作成する方法は？ <code><body><\/code>\n<\/p>獨(dú)自のHTMLテンプレートを作成する1つの方法は、Webページを取得し、ソースコードをコピーし、各Webページに表示される最も基本的な要素を除くすべてを削除することです。または、既製のhtml5テンプレートを取得して.htmlファイルに貼り付けると、準(zhǔn)備ができています！ <h3><h3>HTML5テンプレートは何に使用されていますか？ <\/h3>\n<p>Webページを設(shè)計(jì)するとき、空白の.htmlページから始めて、すべての退屈なコードをゼロから書(shū)くことほど悪いことはありません。 HTML5テンプレートは、一意のデザインとコンテンツの作業(yè)をすぐに開(kāi)始できるように、実行を開(kāi)始する必要があるすべてのHTMLテンプレートコードを提供します。 <\/p>\n<h3>テンプレートの例は何ですか？ <\/h3>\n<p>インターネットにはHTML5テンプレートの例がたくさんあります。時(shí)間が経つにつれて、HTMLを自分で書(shū)く方法に基づいて獨(dú)自のテンプレートを作成できます。 HTML5テンプレートの例は、ほとんどのWebページで必要なすべての基本要素を提供します。 <\/p>\n<p>非常に簡(jiǎn)単なスタートとして、これを使用できます：<\/p>\n<pre class='brush:php;toolbar:false;'><!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n <title>HTML5 Boilerplate<\/title>\n <link rel=\"stylesheet\" href=\"styles.css\">\n<\/head>\n<body>\n <h1>Page Title<\/h1>\n <??>\n<\/body>\n<\/html><\/pre>\n<h3> HTMLの開(kāi)始コードは何ですか？ <\/h3>\n<p> htmlドキュメントは常にドキュメントタイプの宣言で始まります：<code><!DOCTYPE html><\/code>。次に、Webページ上の他のすべてのコンテンツを含む<code><\/code>タグがあります。 <code><\/code>の2つの子要素は、<code><\/code>および<code><\/code>要素です。 HTML5テンプレートには、Webページに必要なすべての基本開(kāi)始コードが含まれています。 <\/p>\n<h3>すべてのHTMLファイルにはテンプレートが必要ですか？ <\/h3>\n<p>理想的には、はい。 HTMLテンプレートは、Webブラウザーで有用なアクションを?qū)g行するために、HTMLページのコードの最小量を提供します。 WebサイトのすべてのページでHTMLテンプレートコードを使用できます。通常、テンプレートの一般的な要素は、フレームワークやインクルードファイルなど、単一のソースからページに注入され、すべてのページのテンプレートを一度に更新できます。 HTML5テンプレートは、開(kāi)始する必要があるすべてのHTMLテンプレートコードを提供します。 <\/p>"} </script> <meta http-equiv="Cache-Control" content="no-transform" /> <meta http-equiv="Cache-Control" content="no-siteapp" /> <script>var V_PATH="/";window.onerror=function(){ return true; };</script> </head> <body data-commit-time="2023-12-28T14:50:12+08:00" class="editor_body body2_2"> <link rel="stylesheet" type="text/css" href="/static/csshw/stylehw.css"> <header> <div id="377j5v51b" class="head"> <div id="377j5v51b" class="haed_left"> <div id="377j5v51b" class="haed_logo"> <a href="http://miracleart.cn/ja/" title="" class="haed_logo_a"> <img src="/static/imghw/logo.png" alt="" class="haed_logoimg"> </a> </div> <div id="377j5v51b" class="head_nav"> <div id="377j5v51b" class="head_navs"> <a href="javascript:;" title="コミュニティ" class="head_nava head_nava-template1">コミュニティ</a> <div class="377j5v51b" id="dropdown-template1" style="display: none;"> <div id="377j5v51b" class="languagechoose"> <a href="http://miracleart.cn/ja/article.html" title="記事" class="languagechoosea on">記事</a> <a href="http://miracleart.cn/ja/faq/zt" title="トピックス" class="languagechoosea">トピックス</a> <a href="http://miracleart.cn/ja/wenda.html" title="に質(zhì)問(wèn)" class="languagechoosea">に質(zhì)問(wèn)</a> </div> </div> </div> <div id="377j5v51b" class="head_navs"> <a href="javascript:;" title="學(xué)ぶ" class="head_nava head_nava-template1_1">學(xué)ぶ</a> <div class="377j5v51b" id="dropdown-template1_1" style="display: none;"> <div id="377j5v51b" class="languagechoose"> <a href="http://miracleart.cn/ja/course.html" title="コース" class="languagechoosea on">コース</a> <a href="http://miracleart.cn/ja/dic/" title="プログラミング辭典" class="languagechoosea">プログラミング辭典</a> </div> </div> </div> <div id="377j5v51b" class="head_navs"> <a href="javascript:;" title="ツールライブラリ" class="head_nava head_nava-template1_2">ツールライブラリ</a> <div class="377j5v51b" id="dropdown-template1_2" style="display: none;"> <div id="377j5v51b" class="languagechoose"> <a href="http://miracleart.cn/ja/toolset/development-tools" title="開(kāi)発ツール" class="languagechoosea on">開(kāi)発ツール</a> <a href="http://miracleart.cn/ja/toolset/website-source-code" title="公式サイト" class="languagechoosea">公式サイト</a> <a href="http://miracleart.cn/ja/toolset/php-libraries" title="PHP ライブラリ" class="languagechoosea">PHP ライブラリ</a> <a href="http://miracleart.cn/ja/toolset/js-special-effects" title="JS特殊効果" class="languagechoosea on">JS特殊効果</a> <a href="http://miracleart.cn/ja/toolset/website-materials" title="サイト素材" class="languagechoosea on">サイト素材</a> <a href="http://miracleart.cn/ja/toolset/extension-plug-ins" title="拡張プラグイン" class="languagechoosea on">拡張プラグイン</a> </div> </div> </div> <div id="377j5v51b" class="head_navs"> <a href="http://miracleart.cn/ja/ai" title="AIツール" class="head_nava head_nava-template1_3">AIツール</a> </div> <div id="377j5v51b" class="head_navs"> <a href="javascript:;" title="レジャー" class="head_nava head_nava-template1_3">レジャー</a> <div class="377j5v51b" id="dropdown-template1_3" style="display: none;"> <div id="377j5v51b" class="languagechoose"> <a href="http://miracleart.cn/ja/game" title="ゲームのダウンロード" class="languagechoosea on">ゲームのダウンロード</a> <a href="http://miracleart.cn/ja/mobile-game-tutorial/" title="ゲームのチュートリアル" class="languagechoosea">ゲームのチュートリアル</a> </div> </div> </div> </div> </div> <div id="377j5v51b" class="head_search"> <input id="key_words" onkeydown="if (event.keyCode == 13) searchs('ja')" class="search-input" type="text" autocomplete="off" name="keywords" required="required" placeholder="Block,address,transaction,news" value=""> <a href="javascript:;" title="検索" onclick="searchs('ja')"><img src="/static/imghw/find.png" alt="検索"></a> </div> <div id="377j5v51b" class="head_right"> <div id="377j5v51b" class="haed_language"> <a href="javascript:;" class="layui-btn haed_language_btn">日本語(yǔ)<i class="layui-icon layui-icon-triangle-d"></i></a> <div class="377j5v51b" id="dropdown-template" style="display: none;"> <div id="377j5v51b" class="languagechoose"> <a href="javascript:setlang('zh-cn');" title="簡(jiǎn)體中文" class="languagechoosea">簡(jiǎn)體中文</a> <a href="javascript:setlang('en');" title="English" class="languagechoosea">English</a> <a href="javascript:setlang('zh-tw');" title="繁體中文" class="languagechoosea">繁體中文</a> <a href="javascript:;" title="日本語(yǔ)" class="languagechoosea">日本語(yǔ)</a> <a href="javascript:setlang('ko');" title="???" class="languagechoosea">???</a> <a href="javascript:setlang('ms');" title="Melayu" class="languagechoosea">Melayu</a> <a href="javascript:setlang('fr');" title="Fran?ais" class="languagechoosea">Fran?ais</a> <a href="javascript:setlang('de');" title="Deutsch" class="languagechoosea">Deutsch</a> </div> </div> </div> <span id="377j5v51b" class="head_right_line"></span> <div style="display: block;" id="login" class="haed_login "> <a href="javascript:;" title="Login" class="haed_logina ">Login</a> </div> <div style="display: block;" id="reg" class="head_signup login"> <a href="javascript:;" title="singup" class="head_signupa">singup</a> </div> </div> </div> </header> <main> <div id="377j5v51b" class="Article_Details_main"> <div id="377j5v51b" class="Article_Details_main1"> <div id="377j5v51b" class="Article_Details_main1L"> <div id="377j5v51b" class="Article_Details_main1Lmain" id="Article_Details_main1Lmain"> <div id="377j5v51b" class="Article_Details_main1L1">目次</div> <div id="377j5v51b" class="Article_Details_main1L2" id="Article_Details_main1L2">  <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#上記の文字エンコードの例では-UTF-文字セットを使用します-ほとんどすべての場(chǎng)合" title="上記の文字エンコードの例では、UTF-8文字セットを使用します。ほとんどすべての場(chǎng)合、" >上記の文字エンコードの例では、UTF-8文字セットを使用します。ほとんどすべての場(chǎng)合、</a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#スタイルシートはドキュメントのどこにでも含めることができますが-通常" title="スタイルシートはドキュメントのどこにでも含めることができますが、通常、" >スタイルシートはドキュメントのどこにでも含めることができますが、通常、</a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#javaScriptコードは通常" title=" javaScriptコードは通常" > javaScriptコードは通常</a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#" title="、" >、</a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#h-HTML-テンプレートは何に使用されていますか" title="<h3>HTML5テンプレートは何に使用されていますか？ " ><h3>HTML5テンプレートは何に使用されていますか？ </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#テンプレートの例は何ですか" title="テンプレートの例は何ですか？ " >テンプレートの例は何ですか？ </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#HTMLの開(kāi)始コードは何ですか" title=" HTMLの開(kāi)始コードは何ですか？ " > HTMLの開(kāi)始コードは何ですか？ </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#すべてのHTMLファイルにはテンプレートが必要ですか" title="すべてのHTMLファイルにはテンプレートが必要ですか？ " >すべてのHTMLファイルにはテンプレートが必要ですか？ </a> </div> </div> </div> </div> <div id="377j5v51b" class="Article_Details_main1M"> <div id="377j5v51b" class="phpgenera_Details_mainL1"> <a href="http://miracleart.cn/ja/" title="ホームページ" class="phpgenera_Details_mainL1a">ホームページ</a> <img src="/static/imghw/top_right.png" alt="" /> <a href="http://miracleart.cn/ja/web-designer.html" class="phpgenera_Details_mainL1a">ウェブフロントエンド</a> <img src="/static/imghw/top_right.png" alt="" /> <a href="http://miracleart.cn/ja/css-tutorial.html" class="phpgenera_Details_mainL1a">CSSチュートリアル</a> <img src="/static/imghw/top_right.png" alt="" /> <span>HTML5テンプレート：プロジェクト用のベーススターターHTMLボイラープレート</span> </div> <div id="377j5v51b" class="Articlelist_txts"> <div id="377j5v51b" class="Articlelist_txts_info"> <h1 class="Articlelist_txts_title">HTML5テンプレート：プロジェクト用のベーススターターHTMLボイラープレート</h1> <div id="377j5v51b" class="Articlelist_txts_info_head"> <div id="377j5v51b" class="author_info"> <a href="http://miracleart.cn/ja/member/1468495.html" class="author_avatar"> <img class="lazy" data-src="https://img.php.cn/upload/avatar/000/000/001/66ea810373f2f131.png" src="/static/imghw/default1.png" alt="Joseph Gordon-Levitt"> </a> <div id="377j5v51b" class="author_detail"> <a href="http://miracleart.cn/ja/member/1468495.html" class="author_name">Joseph Gordon-Levitt</a> </div> </div> </div> <span id="377j5v51b" class="Articlelist_txts_time">Feb 08, 2025 am 08:50 AM</span> </div> </div> <hr /> <div id="377j5v51b" class="article_main php-article"> <div id="377j5v51b" class="article-list-left detail-content-wrap content"> <ins class="adsbygoogle" style="display:block; text-align:center;" data-ad-layout="in-article" data-ad-format="fluid" data-ad-client="ca-pub-5902227090019525" data-ad-slot="3461856641"> </ins> <p>獨(dú)自のHTML5テンプレートを構(gòu)築する：簡(jiǎn)潔なガイド</p> <p> <img src="/static/imghw/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/173897581160448.jpg" class="lazy" alt="HTML5 Template: A Base Starter HTML Boilerplate for Any Project "></p> <p>この記事では、獨(dú)自のHTML5テンプレートを作成する方法について説明します。 HTML Basicテンプレートの重要な要素を説明し、最後に使用してさらに構(gòu)築できるシンプルなテンプレートを提供します。 </p> この記事を読んだ後、獨(dú)自のHTML5テンプレートがあります。今すぐHTMLテンプレートコードを取得したい場(chǎng)合は、この記事を後でお読みください。最後のHTML5テンプレートを次に示します。 <p> </p> <p>キーポイント<strong></strong> </p> <ul>HTML5テンプレートは、再利用可能なテンプレートとして、必要なHTML要素を含む、各プロジェクトの開(kāi)始時(shí)に繰り返しコード作成を避けるのに役立ちます。 <li> </li>基本的なHTML5テンプレートには、ドキュメントタイプ宣言、言語(yǔ)屬性を備えた要素、<li>を介した文字エンコード、およびレスポンシブデザインのビューポート設(shè)定を含める必要があります。 <code></code> 通常、<code><meta charset="utf-8"></code>html5テンプレート</li>セクションの重要な要素には、通常、SEOのメタデータ、CSSスタイルシートへのリンク、およびオプションのJavaScriptファイルが含まれています。 <li> <code></code>ソーシャルメディアの最適化の場(chǎng)合、オープングラフメタタグを追加すると、ソーシャルプラットフォームで共有されたときにコンテンツの表示効果が強(qiáng)化されます。 </li> <li>テンプレートにFaviconとAppleのタッチアイコンを含めると、ブランドアイデンティティを構(gòu)築し、デバイス全體でユーザーエクスペリエンスを向上させるのに役立ちます。 </li> <li>閉じた前にjavaScriptファイルを置く</li>タグは、ロードスクリプトを遅らせることでブラウザがページをより速くレンダリングできるため、ページの読み込み速度を改善できます。 <li> <code></code> </li> </ul>HTMLテンプレートとは何ですか？ <p><strong> </strong>各Webサイトは異なりますが、Webサイトから別のWebサイトまで、多くのことが基本的に同じです。同じコードを何度も書(shū)き込む代わりに、獨(dú)自の「テンプレート」を作成します。テンプレートは、プロジェクトを開(kāi)始するたびに使用するテンプレートであり、ゼロから始めることを妨げることができます。 </p> <p>ウィキペディアはテンプレートを次のように説明しています </p> <p>コードスニペットは、複數(shù)の場(chǎng)所で繰り返し表示され、変更はほとんどありません。 </p> <blockquote> <p>HTML5を?qū)W習(xí)し、ツールボックスに新しいテクノロジーを追加すると、將來(lái)のすべてのプロジェクトを開(kāi)始するためにHTMLテンプレートを構(gòu)築することができます。それは間違いなくやる価値があり、あなたがあなた自身のHTML5テンプレートを構(gòu)築するのに役立つオンラインでたくさんの出発點(diǎn)があります。 </p> </blockquote> <p>html5テンプレートの非常に簡(jiǎn)単な例</p> <p> この記事の最後に提供される完全なテンプレートには、多くのコンテンツが含まれています。しかし、あなたはそれをそのようにする必要はありません - 特にあなたがちょうど學(xué)び始めたとき。これは非常にシンプルな「初心者」のHTML5テンプレートです。これはおそらく必要な唯一のものです。 <strong> </strong>上記のコードを.htmlファイルに貼り付けると、Webページがあります！この基本的なHTML5テンプレートには、次のセクションにリストされている要素の一部と、Webブラウザーに表示されるシンプルなタイトル要素が含まれています。 </p> <p>その構(gòu)造を詳しく見(jiàn)てみましょう。 </p> <pre class='brush:php;toolbar:false;'><!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>HTML5 Boilerplate</title> <link rel="stylesheet" href="styles.css"> </head> <body> <h1>Page Title</h1> <??> </body> </html></pre><p>html5テンプレートの構(gòu)造</p><p> </p>HTMLテンプレートには通常、次の部分が含まれています<ol> <li>ドキュメントタイプ宣言（またはdoctype）</li> <li><code><html></code>要素</li> <li>文字エンコード</li> <li>ビューポート要素</li> <li><code><title></code>、説明と著者</li> ソーシャルカードのグラフ要素を開(kāi)く<li> </li>ファビコンとタッチアイコン<li> </li>css styleSheet link<li> </li>javaScriptファイルリンク<li> </li> </ol>ドキュメントタイプの宣言と<p>要素に加えて、上記の要素のほとんどは、HTMLテンプレートの<code><html></code>セクションにあります。 <code><head></code> </p><p>html5ドキュメントタイプステートメント<strong></strong> </p> HTML5テンプレートは、ドキュメントタイプの宣言または<p>doctype<em>から始める必要があります。 Doctypeは、ブラウザまたは他のパーサーにどのような種類のドキュメントを探しているかを伝える1つの方法にすぎません。 HTMLファイルの場(chǎng)合、これはHTMLの特定のバージョンとタイプを意味します。 Doctypeは、常にHTMLファイルの上部にある最初のアイテムである必要があります。何年も前に、Doctype宣言はugい混亂を覚えにくいことはありませんでした。通常は「XHTML Strict」または「HTML Transitional」と指定されていました。 </em> </p> html5の出現(xiàn)により、それらの理解できない迷惑なものは消えました、そして今あなたはこれだけが必要です：<p> </p> <pre class='brush:php;toolbar:false;'><!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>HTML5 Boilerplate</title> <link rel="stylesheet" href="styles.css"> </head> <body> <h1>Page Title</h1> <??> </body> </html></pre>シンプルで明確です。「5」は聲明からはっきりと消えました。 Webタグの現(xiàn)在のバージョンは「HTML5」と呼ばれますが、実際には以前のHTML標(biāo)準(zhǔn)の進(jìn)化にすぎません。將來(lái)の仕様は、今日の開(kāi)発にすぎません。「HTML6」は決してないので、現(xiàn)在の狀態(tài)のWebタグは通常、単に「HTML」と呼ばれます。 <p> </p>ブラウザはWeb上の古いコンテンツをサポートする必要があるため、Doctypeに依存して、特定のドキュメントでサポートする機(jī)能をブラウザに伝えることはありません。言い換えれば、Doctypeは最新のHTML機(jī)能にページに準(zhǔn)拠していません。実際、使用されているDoctypeに関係なく、ブラウザはケースごとに機(jī)能サポートケースを決定します。実際、ページに新しいHTML5要素を使用して古いDoctypeを使用でき、ページは新しいDoctypeを使用するときと同じようにレンダリングできます。 <p> </p> <p><strong>要素<code><html></code> </strong> </p><p>要素は、HTMLファイルの上位レベル要素です。つまり、ドキュメント內(nèi)のDoctype以外のすべてが含まれています。 <code><html></code>要素は、<code><html></code>および<code><head></code>パーツの2つの部分に分割されます。 Webページファイル內(nèi)の他のすべてのコンテンツは、<code><body></code>要素內(nèi)または內(nèi)部に配置されます。次のコードには、Doctype宣言の後に配置され、<code><html></code>および<code><html></code>要素が含まれている<code><html></code>要素が表示されます。 <code><head></code> <code><body></code></p>html <pre class='brush:php;toolbar:false;'><!DOCTYPE html></pre><p>でタグを使用する方法 <shurte <strong></strong>セクションには、文書(shū)に関する重要な情報(bào)が含まれています。これは、文字エンコードやCSSファイルへのリンク、場(chǎng)合によってはJavaScriptファイルなど、エンドユーザーに表示されません。この情報(bào)は、ブラウザ、検索エンジン、スクリーンリーダーなどのマシンで使用されます。 </p> 上記の<p>…<code><head></code>タグの間に含まれるすべての要素は重要ですが、エンドユーザーはそれを見(jiàn)ません - </p>テキストを除いて、オンライン検索とブラウザのタグに表示されます。 <pre class='brush:php;toolbar:false;'><html lang="en"> <head> </head> <body> </body> </html></pre><p><strong>html </strong></p>でタグを使用する方法 <p><code><body></code>セクションには、テキスト、畫(huà)像などなど、ブラウザに表示されるすべてのものが含まれています。エンドユーザーに何かを見(jiàn)せたい場(chǎng)合は、オンとオフの間に<code><body></code>…<code></body></code>タグ：</p>に配置してください。 <pre class='brush:php;toolbar:false;'><!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>HTML5 Boilerplate</title> <link rel="stylesheet" href="styles.css"> </head> <body> <h1>Page Title</h1> <??> </body> </html></pre> <p> <img src="/static/imghw/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/173897581228837.jpg" class="lazy" alt="HTML5 Template: A Base Starter HTML Boilerplate for Any Project " /></p> <p> <strong><code>lang</code>屬性は何ですか？ </strong></p> 上記のコード（<p>）に示すように、<code><html></code><code>lang</code>要素には<code><html lang="en"></code>屬性が含まれている必要があります。その主な目的は、スクリーンリーダーなどの支援技術(shù)に、聲を出して読むときにそれらを発音する方法を伝えることです。（このプロパティはページの検証には必要ありませんが、ほとんどのバリデーターは、それを含めない場(chǎng)合は警告を発します。）</p> <p>上記に示す<code>lang</code>屬性の値は<code>en</code>であり、ドキュメントが英語(yǔ)で記述されていることを指定します。他のすべての話された言語(yǔ)には、フランス語(yǔ)の<code>fr</code>、ドイツ語(yǔ)の<code>de</code>、ヒンディー語(yǔ)などの値があります。（ウィキペディアで言語(yǔ)コードの完全なリストを見(jiàn)つけることができます。）<code>hi</code> </p><p>htmlドキュメント文字エンコード<strong></strong> </p>htmlドキュメント<p>セクションの最初の行は、ドキュメントの文字エンコードを定義する行です。 Webページで読む文字と記號(hào)は一連の數(shù)字として定義され、一部の文字（文字など）は多くの方法でエンコードされています。したがって、どのWebページを參照すべきかをコンピューターに伝えることは便利です。インジケータ文字エンコーディングは、バリデーターに警告を発することのないオプションの機(jī)能ですが、ほとんどのHTMLページでは推奨されます。 <code><head></code> </p><pre class='brush:php;toolbar:false;'><!DOCTYPE html></pre>注：一部の古いブラウザが正しくエンコードされている文字を読み取ることを確認(rèn)するには、ドキュメントの最初の512文字のどこかに宣言をエンコードする文字全體を含める必要があります。また、コンテンツベースの要素の前に表示される必要があります（例の後半に表示される<p>要素など）。 <em><code><title></code> </em>なぜHTML5テンプレートでUTF-8文字エンコードを使用するのですか？ </p> <h3 id="上記の文字エンコードの例では-UTF-文字セットを使用します-ほとんどすべての場(chǎng)合">上記の文字エンコードの例では、UTF-8文字セットを使用します。ほとんどすべての場(chǎng)合、</h3>はドキュメントで使用する必要がある値です。このエンコーディングは、他のエンコーディングに含まれていないさまざまな文字をカバーします。たとえば、Webで奇妙なキャラクターに遭遇した可能性があります。これは明らかにバグです。これは通常、ブラウザがドキュメントで指定された文字セットに予想される文字を見(jiàn)つけることができないためです。 <p> <code>utf-8</code>UTF-8は、世界中のさまざまな言語(yǔ)の多くのキャラクターや、多くの有用なシンボルを含む、さまざまなキャラクターをカバーしています。 World Wide Web Allianceが説明するように：</p> <p> </p>Unicodeベースのエンコーディング（UTF-8など）は複數(shù)の言語(yǔ)をサポートでき、あらゆる言語(yǔ)の混合ページとフォームに適合させることができます。その使用は、サーバー側(cè)のロジックを排除する可能性があり、それにより、各サービスページまたは各著信フォームの提出の文字エンコードを個(gè)別に決定します。これにより、多言語(yǔ)のWebサイトまたはアプリケーションの処理の複雑さが大幅に削減されます。 <blockquote></blockquote> <p>文字エンコードの完全な説明はこの記事の範(fàn)囲を超えていますが、より深く掘り下げたい場(chǎng)合は、HTML仕様で文字エンコードについて読むことができます。 </p> <p> <strong><code>X-UA-Compatible</code>とはどういう意味ですか？ </strong></p> <p>あなたは時(shí)々あなたのHTMLドキュメントの<code><head></code>にこの行を見(jiàn)る：</p> <pre class='brush:php;toolbar:false;'><!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>HTML5 Boilerplate</title> <link rel="stylesheet" href="styles.css"> </head> <body> <h1>Page Title</h1> <??> </body> </html></pre> <p>このメタタグにより、Web Authorsはページをレンダリングするインターネットエクスプローラーのバージョンを選択できます。インターネットエクスプローラーが主に悪いメモリになっているので、コードからこの行を安全に削除できます。（HTML5テンプレートから削除しました。）IEの古いバージョンでページが表示されると確信している場(chǎng)合は、それを含める価値があるかもしれません。このメタタグの詳細(xì)については、Microsoft Webサイトで読むことができます。 </p> <p><strong>ビューポート要素</strong></p> <p>ビューポート要素は、ほぼすべてのHTML5テンプレートに表示される機(jī)能です。レスポンシブなWebデザインとモバイルファーストデザインにとって非常に重要です：</p> <pre class='brush:php;toolbar:false;'><!DOCTYPE html></pre> <p>この<code><meta></code>要素には、名前/値セットとして一緒に機(jī)能する2つのプロパティが含まれています。この場(chǎng)合、名前は<code>viewport</code>に設(shè)定され、値は<code>width=device-width, initial-scale=1</code>に設(shè)定されています。これはモバイルデバイスのみです。値には2つの部分があることに気付くでしょう。 </p> <ul><li>：Webサイトに提示したいビューポートのピクセル幅。 <code>width=device-width</code> </li><li>：これは0.0?10.0の間の正の數(shù)字である必要があります。「1」の値は、デバイスの幅とビューポートサイズの間の1：1の比率を示します。 <code>initial-scale</code> </li> </ul>MDNのこれらのメタ要素プロパティの詳細(xì)については、ほとんどの場(chǎng)合、このメタ要素とその設(shè)定がモバイルファーストレスポンシブWebサイトに最適であることを知っておく必要があります。 <p> </p> <p><strong>、説明と著者<code><title></code></strong> </p>HTMLベーステンプレートの次の部分には、次の3行が含まれています。 <p> </p><pre class='brush:php;toolbar:false;'><html lang="en"> <head> </head> <body> </body> </html></pre>ブラウザのタイトルバーに表示されるもの（たとえば、ブラウザタブの上にホバーするとき）も検索結(jié)果に表示されます。この要素は、<p>セクションの唯一の要素です。説明と著者の金屬はオプションですが、検索エンジンに重要な情報(bào)を提供します。検索結(jié)果では、上記のコード例のタイトルと説明を以下に示します。 <code><title></code> <code><head></code> </p><p> <img src="/static/imghw/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/173897581334276.jpg" class="lazy" alt="HTML5 Template: A Base Starter HTML Boilerplate for Any Project " /></p>に任意の數(shù)の有効な要素を配置できます。 <p> ソーシャルカードのグラフ要素を開(kāi)く<code><head></code></p> 上記のように、<p>すべてのメタ要素はオプションですが、多くはSEOおよびソーシャルメディアマーケティングに適しています。 HTML5テンプレートの次の部分には、これらのメタエレメントオプションの一部が含まれています。 <strong> </strong>これらの要素は、いわゆるオープングラフプロトコルを利用しており、使用できる他の多くの要素があります。これらは、最も頻繁に使用する要素です。 Open Graph Webサイトで、利用可能なオープングラフメタオプションの完全なリストを表示できます。 </p><p>ここに含まれるこれらの要素は、ソーシャルメディアの投稿にリンクされたときにWebページの外観を強(qiáng)化します。たとえば、ここに含まれる5つの<code><meta></code>要素は、次のデータが埋め込まれたソーシャルカードに表示されます。 </p> コンテンツのタイトル<ul><li> </li>提供されたコンテンツタイプ<li> </li>コンテンツ仕様url<li> </li>コンテンツの説明<li> コンテンツに関連付けられている</li>畫(huà)像<li> </li> </ul>ソーシャルメディアで共有されている投稿が表示されると、通常、これらのデータビットがソーシャルメディアの投稿に自動(dòng)的に追加されます。たとえば、GitHubホームページへのリンクを含めると、ツイートに次のものが表示されます。 <p> </p> <p><img src="/static/imghw/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/173897581532472.jpg" class="lazy" alt="HTML5 Template: A Base Starter HTML Boilerplate for Any Project " /> </p><p>ファビコンとタッチアイコン<strong> </strong> </p>HTML5テンプレートの次の部分には、FaviconおよびApple Touchのアイコンとして含まれるリソースを示す<p>要素が含まれています。 <code><link></code> </p>Faviconは、誰(shuí)かがあなたのウェブサイトをチェックすると、ブラウザタブに表示されます。 <pre class='brush:php;toolbar:false;'><!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>HTML5 Boilerplate</title> <link rel="stylesheet" href="styles.css"> </head> <body> <h1>Page Title</h1> <??> </body> </html></pre>ファイルは古いブラウザで使用されており、コードに含める必要はありません。プロジェクトのrootディレクトリに<p>ファイルが含まれている限り、ブラウザは自動(dòng)的に見(jiàn)つけます。 <code>favicon.ico</code>ファイルは、SVGアイコンをサポートする最新のブラウザで使用されます。代わりに.pngファイルを使用することもできます。 <code>favicon.ico</code> <code>favicon.svg</code>最後の要素は、ユーザーのホーム畫(huà)面にページを追加するときにAppleデバイスで使用されるアイコンを參照します。 </p> <p>他のアイコンを參照するWebアプリケーションマニフェストファイルなど、追加のオプションをここに含めることができます。詳細(xì)については、このトピックに関するAndrey Sitnikの記事を読むことをお?jiǎng)幛幛筏蓼埂￥筏?、ここに含まれるものは、単純なHTML初心者テンプレートに十分です。 </p> <p></p>CSSスタイルシートとJavaScriptファイルが含まれています<p><strong> </strong> HTMLの最後の2つの重要な部分は、テンプレートを開(kāi)始することです。1つ以上のStyleSheetsと場(chǎng)合によってはJavaScriptファイルへの參照です。もちろん、両方ともオプションですが、少なくともCSSスタイルを持っていないサイトはほとんどありません。 </p> <p>htmlテンプレートにCSS styleSheetを含める</p> <h3 id="スタイルシートはドキュメントのどこにでも含めることができますが-通常">スタイルシートはドキュメントのどこにでも含めることができますが、通常、</h3>セクション：<p>に表示されます。 <code><head></code> </p><pre class='brush:php;toolbar:false;'><!DOCTYPE html></pre>要素は、Webブラウザーを外部StyleSheetに向けて、これらのCSSスタイルをページに適用できるようにします。 <p>要素には、<code><link></code>屬性が必要です。過(guò)去には、通常は<code><link></code>屬性もありましたが、実際には必要ありませんでした。そのため、ウェブ上にそれを含む古いコードを見(jiàn)つけた場(chǎng)合、削除するだけです。 <code>rel</code> <code>stylesheet</code> cssリンクの最後に<code>type</code>クエリ文字列を追加したことに注意してください。これは完全にオプションです。これは、スタイルシートを更新してこのクエリ文字列を更新するときに便利なトリックです（たとえば、1.1または2.0に更新します）。これにより、ブラウザがCSSファイルの古いキャッシュされたコピーを破棄し、新しい1つのバージョンをロードすることが保証されるためです。 </p><p><code><link></code>要素を使用してWebページにCSSを含める必要がないことは注目に値します。 <code><style></code>セクション。これはレイアウトを?qū)g験する場(chǎng)合は非常に便利ですが、これらのスタイルは他のページでアクセスできないため、非効率的および/または重複するコードになるため、アクティブサイトでは一般的にはお?jiǎng)幛幛筏蓼护蟆?<code></style></code> <code><head></code> htmlテンプレートにjavascriptファイルを含める</p> <h3 id="javaScriptコードは通常"> javaScriptコードは通常</h3><p>に渡されます <code></pre> ? <p> </body></code>タグ：<code></p></code>にスクリプトを埋め込みました <pre class='brush:php;toolbar:false;'><!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>HTML5 Boilerplate</title> <link rel="stylesheet" href="styles.css"> </head> <body> <h1>Page Title</h1> <??> </body> </html></pre> 古いブラウザと新しい要素に関する<p> <strong>手順</strong></p> <p> html5が導(dǎo)入されたとき、<code><article></code>や<code><aside></code>などの多くの新しい要素が含まれていました。正體不明の要素のサポートは、古いブラウザーにとって大きな問(wèn)題だと思うかもしれませんが、そうではありません！ほとんどのブラウザは、実際に使用するタグを気にしません。 <code><recipe></code>要素（または<code><ziggy></code>要素）を含むHTMLドキュメントがあり、CSSが特定のスタイルをその要素に添付している場(chǎng)合、ほぼすべてのブラウザがこのようにそれを処理します。。 </aside> </article> </ziggy> </recipe></p> もちろん、そのような仮定は確認(rèn)されず、アクセシビリティの問(wèn)題があるかもしれませんが、ほとんどすべてのブラウザーで正しくレンダリングされます。例外は、インターネットエクスプローラーの古いバージョンです（つまり）。バージョン9の前に、IEは認(rèn)識(shí)されていない要素がスタイルを受信することをブロックしました。レンダリングエンジンは、これらの不思議な要素を「未知の要素」として扱うため、外観や行動(dòng)を変えることはできません。これには、想像した要素だけでなく、新しいHTML5要素を含むこれらのブラウザバージョンの開(kāi)発時(shí)に定義されていなかった要素も含まれます。 <p> </p>幸いなことに、新しい要素スタイルをサポートしていない古いブラウザは最近ではほとんど存在していません。そのため、ほとんどすべてのプロジェクトで新しいHTML要素を心配することなく安全に使用できます。 <p> </p>つまり、古いブラウザを本當(dāng)にサポートする必要がある場(chǎng)合は、John Resigが元々開(kāi)発したシンプルなJavaScriptスニペットである信頼できるHTML5 SHIVを使用できます。 Sjoerd Visscherの作品に觸発され、IEの古いバージョンで新しいHTML5要素を様式にしました。実際、これは今日は必要ありません。 Caniuse.comが示すように、HTML5要素は使用中のすべてのブラウザでサポートされています。 <p> <em></em>完全なhtml5テンプレート</p><p> <strong>これは私たちの最終的なHTML5テンプレートです - どのプロジェクトでも使用できるシンプルなテンプレート：</strong> </p> <p>このシンプルで使いやすいHTML5テンプレートコードを今日のプロジェクトに入れることができます！これに基づいて、</p>タグと<pre class='brush:php;toolbar:false;'><!DOCTYPE html></pre>タグの間に必要なものを追加できます。 <p> <code><body></code><code></body></code>結(jié)論</p><p><p>オンラインで多くのHTML初心者テンプレートとフレームワークがあり、既製のCSSとJavaScriptファイル、および好きなように使用および変更できる多くの事前書(shū)き込みコンテンツがあります。これは私たちの目標(biāo)ではありません。ここで提供する基本的なテンプレートには、Webページを設(shè)計(jì)する際に必要なものがすべて含まれているため、毎回ゼロから始める必要はありません。 </p> <p>最初に表示する基本的なHTMLページテンプレート、または上に表示してプロジェクトで使用して使用してください。時(shí)間が経つにつれて、あなたは頻繁に必要としない內(nèi)容があり、ここで言及していないことのいくつかが頻繁に使用していることがあることに気付くかもしれません。そのため、ワークフローに合わせてテンプレートを更新できます。 </p> <p><strong>次のステップ</strong></p> <p>ウェブレイアウトを次のレベルに引き上げる良い方法は、美しいWebデザインの原則、第4版を使用することです。この本は、デザインの原則を教え、<em>と</em>を教えて、ウェブ上でそれらを?qū)g裝する方法を示します。 2020年9月に完全に書(shū)き直され、他の場(chǎng)所で読んでいない最先端のテクノロジーが含まれています。 </p> CSSの知識(shí)を磨くために、最新のCSSプロジェクトコースでは、CSS3の最新の高度なバージョンを習(xí)得するのに役立ちます。 <p> それとは別に、インタラクティブでプログラム的でリアクティブなUIを使用して、ウェブサイトまたはWebアプリケーション開(kāi)発を次のレベルに引き上げることができます。たとえば、JavaScriptとReactのSitePointの膨大なリソースを見(jiàn)てください。そして、最高の足場(chǎng)Webツールとライブラリのガイドを使用して、新しいプロジェクトをより速く開(kāi)始する方法を?qū)Wびます。または、コーディングを?qū)W習(xí)せずにWebエクスペリエンスを構(gòu)築したい場(chǎng)合は、コードレスの動(dòng)きに関するスターターガイドをお読みください。最新のコードレスツールはゲームチェンジャーです。多くの場(chǎng)合、コーディングの強(qiáng)力な代替品を提供するのに十分な力が初めてあります。 </p> <p></p>html5テンプレートf(wàn)aq<p> <strong>最後に、HTML5テンプレートコードに関するよくある質(zhì)問(wèn)に答えます。 </strong> </p> HTMLのテンプレートは何ですか？ <p> </p>テンプレートは、プロジェクトを開(kāi)始するたびに使用されるHTMLページテンプレートであるため、ゼロから開(kāi)始することを避けます。ドキュメントタイプの宣言や、各Webページに表示される基本的なHTML要素などの一般的な要素が含まれます。 <h3> </h3>テンプレートはテンプレートですか？ <p> </p>はい。テンプレートは、キャラクターエンコード、<h3 id="">、</h3>要素、CSSおよびJavaScriptファイルなど、あらゆるWebページに表示される基本要素へのリンクを含む非常にシンプルなHTML初心者テンプレートです。 <p> <code><head></code>HTMLでテンプレートを作成する方法は？ <code><body></code> </p>獨(dú)自のHTMLテンプレートを作成する1つの方法は、Webページを取得し、ソースコードをコピーし、各Webページに表示される最も基本的な要素を除くすべてを削除することです。または、既製のhtml5テンプレートを取得して.htmlファイルに貼り付けると、準(zhǔn)備ができています！ <h3 id="h-HTML-テンプレートは何に使用されていますか"><h3>HTML5テンプレートは何に使用されていますか？ </h3> <p>Webページを設(shè)計(jì)するとき、空白の.htmlページから始めて、すべての退屈なコードをゼロから書(shū)くことほど悪いことはありません。 HTML5テンプレートは、一意のデザインとコンテンツの作業(yè)をすぐに開(kāi)始できるように、実行を開(kāi)始する必要があるすべてのHTMLテンプレートコードを提供します。 </p> <h3 id="テンプレートの例は何ですか">テンプレートの例は何ですか？ </h3> <p>インターネットにはHTML5テンプレートの例がたくさんあります。時(shí)間が経つにつれて、HTMLを自分で書(shū)く方法に基づいて獨(dú)自のテンプレートを作成できます。 HTML5テンプレートの例は、ほとんどのWebページで必要なすべての基本要素を提供します。 </p> <p>非常に簡(jiǎn)単なスタートとして、これを使用できます：</p> <pre class='brush:php;toolbar:false;'><!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>HTML5 Boilerplate</title> <link rel="stylesheet" href="styles.css"> </head> <body> <h1>Page Title</h1> <??> </body> </html></pre> <h3 id="HTMLの開(kāi)始コードは何ですか"> HTMLの開(kāi)始コードは何ですか？ </h3> <p> htmlドキュメントは常にドキュメントタイプの宣言で始まります：<code><!DOCTYPE html></code>。次に、Webページ上の他のすべてのコンテンツを含む<code></code>タグがあります。 <code></code>の2つの子要素は、<code></code>および<code></code>要素です。 HTML5テンプレートには、Webページに必要なすべての基本開(kāi)始コードが含まれています。 </p> <h3 id="すべてのHTMLファイルにはテンプレートが必要ですか">すべてのHTMLファイルにはテンプレートが必要ですか？ </h3> <p>理想的には、はい。 HTMLテンプレートは、Webブラウザーで有用なアクションを?qū)g行するために、HTMLページのコードの最小量を提供します。 WebサイトのすべてのページでHTMLテンプレートコードを使用できます。通常、テンプレートの一般的な要素は、フレームワークやインクルードファイルなど、単一のソースからページに注入され、すべてのページのテンプレートを一度に更新できます。 HTML5テンプレートは、開(kāi)始する必要があるすべてのHTMLテンプレートコードを提供します。 </p><p>以上がHTML5テンプレート：プロジェクト用のベーススターターHTMLボイラープレートの詳細(xì)內(nèi)容です。詳細(xì)については、PHP 中國(guó)語(yǔ) Web サイトの他の関連記事を參照してください。</p> </div> </div> <div id="377j5v51b" class="wzconShengming_sp"> <div id="377j5v51b" class="bzsmdiv_sp">このウェブサイトの聲明</div> <div>この記事の內(nèi)容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰屬します。このサイトは、それに相當(dāng)する法的責(zé)任を負(fù)いません。盜作または侵害の疑いのあるコンテンツを見(jiàn)つけた場(chǎng)合は、admin@php.cn までご連絡(luò)ください。</div> </div> </div> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="2507867629"></ins> <div id="377j5v51b" class="AI_ToolDetails_main4sR"> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-5902227090019525" data-ad-slot="3653428331" data-ad-format="auto" data-full-width-responsive="true"></ins>  <div id="377j5v51b" class="phpgenera_Details_mainR3"> <div id="377j5v51b" class="phpmain1_4R_readrank"> <div id="377j5v51b" class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hottools2.png" alt="" /> <h2>ホットAIツール</h2> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3_bottom"> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://miracleart.cn/ja/ai/undress-ai-tool" title="Undress AI Tool" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173410641626608.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Undress AI Tool" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://miracleart.cn/ja/ai/undress-ai-tool" title="Undress AI Tool" class="phpmain_tab2_mids_title"> <h3>Undress AI Tool</h3> </a> <p>脫衣畫(huà)像を無(wú)料で</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://miracleart.cn/ja/ai/undresserai-undress" title="Undresser.AI Undress" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173411540686492.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Undresser.AI Undress" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://miracleart.cn/ja/ai/undresserai-undress" title="Undresser.AI Undress" class="phpmain_tab2_mids_title"> <h3>Undresser.AI Undress</h3> </a> <p>リアルなヌード寫(xiě)真を作成する AI 搭載アプリ</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://miracleart.cn/ja/ai/ai-clothes-remover" title="AI Clothes Remover" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173411552797167.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="AI Clothes Remover" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://miracleart.cn/ja/ai/ai-clothes-remover" title="AI Clothes Remover" class="phpmain_tab2_mids_title"> <h3>AI Clothes Remover</h3> </a> <p>寫(xiě)真から衣服を削除するオンライン AI ツール。</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://miracleart.cn/ja/ai/clothoffio" title="Clothoff.io" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173411529149311.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Clothoff.io" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://miracleart.cn/ja/ai/clothoffio" title="Clothoff.io" class="phpmain_tab2_mids_title"> <h3>Clothoff.io</h3> </a> <p>AI衣類リムーバー</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://miracleart.cn/ja/ai/video-swap" title="Video Face Swap" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173414504068133.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Video Face Swap" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://miracleart.cn/ja/ai/video-swap" title="Video Face Swap" class="phpmain_tab2_mids_title"> <h3>Video Face Swap</h3> </a> <p>完全無(wú)料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡(jiǎn)単に交換できます。</p> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3_more"> <a href="http://miracleart.cn/ja/ai">もっと見(jiàn)る</a> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4"> <div id="377j5v51b" class="phpmain1_4R_readrank"> <div id="377j5v51b" class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hotarticle2.png" alt="" /> <h2>人気の記事</h2> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottom"> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://miracleart.cn/ja/faq/1796819578.html" title="KB5060533を修正する方法Windows 10にインストールできませんか？" class="phpgenera_Details_mainR4_bottom_title">KB5060533を修正する方法Windows 10にインストールできませんか？</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>4週間前</span> <span>By DDD</span> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://miracleart.cn/ja/faq/1796819730.html" title="砂丘：覚醒 - 斷熱布を入手する場(chǎng)所" class="phpgenera_Details_mainR4_bottom_title">砂丘：覚醒 - 斷熱布を入手する場(chǎng)所</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>3週間前</span> <span>By Jack chen</span> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://miracleart.cn/ja/faq/1796819016.html" title="Gmailログイン：Gmail -Minitoolからサインアップ、サインイン、またはサインアウトする方法" class="phpgenera_Details_mainR4_bottom_title">Gmailログイン：Gmail -Minitoolからサインアップ、サインイン、またはサインアウトする方法</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>1 か月前</span> <span>By Jack chen</span> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://miracleart.cn/ja/faq/1796819994.html" title="KB5060999を修正する方法Windows 11にインストールできませんか？" class="phpgenera_Details_mainR4_bottom_title">KB5060999を修正する方法Windows 11にインストールできませんか？</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>3週間前</span> <span>By DDD</span> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://miracleart.cn/ja/faq/1796819536.html" title="汚染された聖杯のギルドガイド：アバロンの崩壊" class="phpgenera_Details_mainR4_bottom_title">汚染された聖杯のギルドガイド：アバロンの崩壊</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>4週間前</span> <span>By Jack chen</span> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3_more"> <a href="http://miracleart.cn/ja/article.html">もっと見(jiàn)る</a> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3"> <div id="377j5v51b" class="phpmain1_4R_readrank"> <div id="377j5v51b" class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hottools2.png" alt="" /> <h2>ホットツール</h2> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3_bottom"> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://miracleart.cn/ja/toolset/development-tools/92" title="メモ帳++7.3.1" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58ab96f0f39f7357.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="メモ帳++7.3.1" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://miracleart.cn/ja/toolset/development-tools/92" title="メモ帳++7.3.1" class="phpmain_tab2_mids_title"> <h3>メモ帳++7.3.1</h3> </a> <p>使いやすく無(wú)料のコードエディター</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://miracleart.cn/ja/toolset/development-tools/93" title="SublimeText3 中國(guó)語(yǔ)版" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58ab97a3baad9677.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="SublimeText3 中國(guó)語(yǔ)版" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://miracleart.cn/ja/toolset/development-tools/93" title="SublimeText3 中國(guó)語(yǔ)版" class="phpmain_tab2_mids_title"> <h3>SublimeText3 中國(guó)語(yǔ)版</h3> </a> <p>中國(guó)語(yǔ)版、とても使いやすい</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://miracleart.cn/ja/toolset/development-tools/121" title="ゼンドスタジオ 13.0.1" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58ab97ecd1ab2670.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="ゼンドスタジオ 13.0.1" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://miracleart.cn/ja/toolset/development-tools/121" title="ゼンドスタジオ 13.0.1" class="phpmain_tab2_mids_title"> <h3>ゼンドスタジオ 13.0.1</h3> </a> <p>強(qiáng)力な PHP 統(tǒng)合開(kāi)発環(huán)境</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://miracleart.cn/ja/toolset/development-tools/469" title="ドリームウィーバー CS6" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58d0e0fc74683535.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="ドリームウィーバー CS6" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://miracleart.cn/ja/toolset/development-tools/469" title="ドリームウィーバー CS6" class="phpmain_tab2_mids_title"> <h3>ドリームウィーバー CS6</h3> </a> <p>ビジュアル Web 開(kāi)発ツール</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://miracleart.cn/ja/toolset/development-tools/500" title="SublimeText3 Mac版" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58d34035e2757995.png?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="SublimeText3 Mac版" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://miracleart.cn/ja/toolset/development-tools/500" title="SublimeText3 Mac版" class="phpmain_tab2_mids_title"> <h3>SublimeText3 Mac版</h3> </a> <p>神レベルのコード編集ソフト（SublimeText3）</p> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3_more"> <a href="http://miracleart.cn/ja/ai">もっと見(jiàn)る</a> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4"> <div id="377j5v51b" class="phpmain1_4R_readrank"> <div id="377j5v51b" class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hotarticle2.png" alt="" /> <h2>ホットトピック</h2> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottom"> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://miracleart.cn/ja/faq/gmailyxdlrkzn" title="Gmailメールのログイン入り口はどこですか？" class="phpgenera_Details_mainR4_bottom_title">Gmailメールのログイン入り口はどこですか？</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>8517</span> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>17</span> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://miracleart.cn/ja/faq/java-tutorial" title="Java チュートリアル" class="phpgenera_Details_mainR4_bottom_title">Java チュートリアル</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>1744</span> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>16</span> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://miracleart.cn/ja/faq/cakephp-tutor" title="CakePHP チュートリアル" class="phpgenera_Details_mainR4_bottom_title">CakePHP チュートリアル</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>1596</span> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>56</span> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://miracleart.cn/ja/faq/laravel-tutori" title="Laravel チュートリアル" class="phpgenera_Details_mainR4_bottom_title">Laravel チュートリアル</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>1537</span> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>28</span> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://miracleart.cn/ja/faq/php-tutorial" title="PHP チュートリアル" class="phpgenera_Details_mainR4_bottom_title">PHP チュートリアル</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>1396</span> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>31</span> </div> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3_more"> <a href="http://miracleart.cn/ja/faq/zt">もっと見(jiàn)る</a> </div> </div> </div> </div> </div> <div id="377j5v51b" class="Article_Details_main2"> <div id="377j5v51b" class="phpgenera_Details_mainL4"> <div id="377j5v51b" class="phpmain1_2_top"> <a href="javascript:void(0);" class="phpmain1_2_top_title">Related knowledge<img src="/static/imghw/index2_title2.png" alt="" /></a> </div> <div id="377j5v51b" class="phpgenera_Details_mainL4_info"> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://miracleart.cn/ja/faq/1796819239.html" title="一部のページにのみCSSを含めるにはどうすればよいですか？" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/174957130281670.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="一部のページにのみCSSを含めるにはどうすればよいですか？" /> </a> <a href="http://miracleart.cn/ja/faq/1796819239.html" title="一部のページにのみCSSを含めるにはどうすればよいですか？" class="phphistorical_Version2_mids_title">一部のページにのみCSSを含めるにはどうすればよいですか？</a> <span id="377j5v51b" class="Articlelist_txts_time">Jun 11, 2025 am 12:01 AM</span> <p class="Articlelist_txts_p">特定のページにCSSを選択的に含める方法は3つあります。1。インラインCSS。頻繁にアクセスされない、または一意のスタイルが必要なページに適しています。 2。柔軟性が必要な狀況に適したJavaScript條件を使用して、外部CSSファイルをロードします。 3。サーバー側(cè)に封じ込められ、サーバー側(cè)の言語(yǔ)を使用したシナリオに適しています。このアプローチは、ウェブサイトのパフォーマンスと保守性を最適化できますが、モジュール性とパフォーマンスのバランスが必要です。</p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://miracleart.cn/ja/faq/1796819001.html" title="Flexbox vsグリッド：CSSレイアウトの重要な違いを理解する" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/174948499050663.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Flexbox vsグリッド：CSSレイアウトの重要な違いを理解する" /> </a> <a href="http://miracleart.cn/ja/faq/1796819001.html" title="Flexbox vsグリッド：CSSレイアウトの重要な違いを理解する" class="phphistorical_Version2_mids_title">Flexbox vsグリッド：CSSレイアウトの重要な違いを理解する</a> <span id="377j5v51b" class="Articlelist_txts_time">Jun 10, 2025 am 12:03 AM</span> <p class="Articlelist_txts_p">flexBoxisidealforone-dimensionAllayouts、whilegridsuitStwo-dimension、complexLayouts.useflexboxforAliingemsinasinginasindgridgridgridgridgridgridgridgrololoveroversandcolumnsintigns。</p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://miracleart.cn/ja/faq/1796819129.html" title="HTMLポップオーバーを使用して自動(dòng)閉鎖通知を作成します" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/242/473/174951991745342.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="HTMLポップオーバーを使用して自動(dòng)閉鎖通知を作成します" /> </a> <a href="http://miracleart.cn/ja/faq/1796819129.html" title="HTMLポップオーバーを使用して自動(dòng)閉鎖通知を作成します" class="phphistorical_Version2_mids_title">HTMLポップオーバーを使用して自動(dòng)閉鎖通知を作成します</a> <span id="377j5v51b" class="Articlelist_txts_time">Jun 10, 2025 am 09:45 AM</span> <p class="Articlelist_txts_p">HTMLポップオーバー屬性は、要素をボタンまたはJavaScriptで開(kāi)閉できるトップレイヤー要素に変換します。ポップオーバーは多くの方法で卻下することができますが、それらを自動(dòng)するオプションはありません。 Preethiにはあなたができるテクニックがあります</p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://miracleart.cn/ja/faq/1796823628.html" title="「レンダリングブロッキングCSS」とは何ですか？" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/175069693197174.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="「レンダリングブロッキングCSS」とは何ですか？" /> </a> <a href="http://miracleart.cn/ja/faq/1796823628.html" title="「レンダリングブロッキングCSS」とは何ですか？" class="phphistorical_Version2_mids_title">「レンダリングブロッキングCSS」とは何ですか？</a> <span id="377j5v51b" class="Articlelist_txts_time">Jun 24, 2025 am 12:42 AM</span> <p class="Articlelist_txts_p">ブラウザは、特にインポートされたスタイルシート、ヘッダーのインラインCSS、および最適化されていないメディアクエリスタイルを使用して、ブラウザがインラインおよび外部CSSをデフォルトで主要なリソースとして表示するため、ページレンダリングをブロックします。 1.重要なCSSを抽出し、HTMLに埋め込みます。 2。JavaScriptを介して非クリティカルなCSSの読み込みを遅らせる。 3.メディア屬性を使用して、印刷スタイルなどのロードを最適化します。 4.リクエストを減らすためにCSSを圧縮およびマージします。ツールを使用してキーCSSを抽出し、REL = "Preload"非同期負(fù)荷を組み合わせ、過(guò)度の分割と複雑なスクリプト制御を避けるためにメディア遅延荷重を合理的に使用することをお?jiǎng)幛幛筏蓼埂?/p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://miracleart.cn/ja/faq/1796820543.html" title="Figmaでロットを使用する方法" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/242/473/174986743677204.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Figmaでロットを使用する方法" /> </a> <a href="http://miracleart.cn/ja/faq/1796820543.html" title="Figmaでロットを使用する方法" class="phphistorical_Version2_mids_title">Figmaでロットを使用する方法</a> <span id="377j5v51b" class="Articlelist_txts_time">Jun 14, 2025 am 10:17 AM</span> <p class="Articlelist_txts_p">次のチュートリアルでは、FigmaでLottieアニメーションを作成する方法を紹介します。 2つのカラフルなデザインを使用して、Figmaでアニメーション化する方法を説明し、FigmaからL(zhǎng)ottie Animationsに移行する方法を示します。必要なのは無(wú)料の図だけです</p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://miracleart.cn/ja/faq/1796820287.html" title="境界の破壊：（s）CSSでタングラムパズルを構(gòu)築します" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/242/473/174978559468682.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="境界の破壊：（s）CSSでタングラムパズルを構(gòu)築します" /> </a> <a href="http://miracleart.cn/ja/faq/1796820287.html" title="境界の破壊：（s）CSSでタングラムパズルを構(gòu)築します" class="phphistorical_Version2_mids_title">境界の破壊：（s）CSSでタングラムパズルを構(gòu)築します</a> <span id="377j5v51b" class="Articlelist_txts_time">Jun 13, 2025 am 11:33 AM</span> <p class="Articlelist_txts_p">少なくとも低レベルのロジックとパズルの動(dòng)作に関しては、SASSがJavaScriptを置き換えることができることが判明しました。マップ、ミックス、機(jī)能、そしてたくさんの數(shù)學(xué)だけで、私たちはタングラムのパズルを生き生きとさせることができました。</p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://miracleart.cn/ja/faq/1796822133.html" title="外部対內(nèi)部CSS：最良のアプローチは何ですか？" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/175035152168797.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="外部対內(nèi)部CSS：最良のアプローチは何ですか？" /> </a> <a href="http://miracleart.cn/ja/faq/1796822133.html" title="外部対內(nèi)部CSS：最良のアプローチは何ですか？" class="phphistorical_Version2_mids_title">外部対內(nèi)部CSS：最良のアプローチは何ですか？</a> <span id="377j5v51b" class="Articlelist_txts_time">Jun 20, 2025 am 12:45 AM</span> <p class="Articlelist_txts_p">TheBestAppRoachforCSDependsonTheProject'sSpecificNeeds.forLargerProjects、externalCssissisbetterduetoMaintainasiladability; forsmallerProjectsOrsingLe-PageApplications、internalcsSmightBemoresuitable.it</p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://miracleart.cn/ja/faq/1796821588.html" title="私のCSSは小文字でなければなりませんか？" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/175026415047262.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="私のCSSは小文字でなければなりませんか？" /> </a> <a href="http://miracleart.cn/ja/faq/1796821588.html" title="私のCSSは小文字でなければなりませんか？" class="phphistorical_Version2_mids_title">私のCSSは小文字でなければなりませんか？</a> <span id="377j5v51b" class="Articlelist_txts_time">Jun 19, 2025 am 12:29 AM</span> <p class="Articlelist_txts_p">いいえ、CSSDOESNOTHAVETOBEINLOWERCASE。</p> </div> </div> <a href="http://miracleart.cn/ja/web-designer.html" class="phpgenera_Details_mainL4_botton"> <span>See all articles</span> <img src="/static/imghw/down_right.png" alt="" /> </a> </div> </div> </div> </main> <footer> <div id="377j5v51b" class="footer"> <div id="377j5v51b" class="footertop"> <img src="/static/imghw/logo.png" alt=""> <p>福祉オンライン PHP トレーニング，PHP 學(xué)習(xí)者の迅速な成長(zhǎng)を支援します！</p> </div> <div id="377j5v51b" class="footermid"> <a href="http://miracleart.cn/ja/about/us.html">私たちについて</a> <a href="http://miracleart.cn/ja/about/disclaimer.html">免責(zé)事項(xiàng)</a> <a href="http://miracleart.cn/ja/update/article_0_1.html">Sitemap</a> </div> <div id="377j5v51b" class="footerbottom"> <p> ? php.cn All rights reserved </p> </div> </div> </footer> <input type="hidden" id="verifycode" value="/captcha.html"> <link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css?2' type='text/css' media='all' /> <footer> <div class="friendship-link"> <p>感谢您访问我们的网站，您可能还对以下资源感兴趣：</p> <a href="http://miracleart.cn/" title="国产av日韩一区二区三区精品">国产av日韩一区二区三区精品</a> <div class="friend-links"> </div> </div> </footer> <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> </body><div id="c55a0" class="pl_css_ganrao" style="display: none;"><small id="c55a0"></small><menu id="c55a0"></menu><var id="c55a0"></var><button id="c55a0"><video id="c55a0"><track id="c55a0"><strike id="c55a0"></strike></track></video></button><tbody id="c55a0"><small id="c55a0"><nav id="c55a0"></nav></small></tbody><legend id="c55a0"><bdo id="c55a0"><i id="c55a0"><xmp id="c55a0"></xmp></i></bdo></legend><strong id="c55a0"></strong><rp id="c55a0"><video id="c55a0"></video></rp><td id="c55a0"><center id="c55a0"><tbody id="c55a0"><abbr id="c55a0"></abbr></tbody></center></td><li id="c55a0"><small id="c55a0"><video id="c55a0"><track id="c55a0"></track></video></small></li><form id="c55a0"></form><ins id="c55a0"><em id="c55a0"></em></ins><address id="c55a0"></address><tt id="c55a0"><option id="c55a0"></option></tt><blockquote id="c55a0"><font id="c55a0"></font></blockquote><form id="c55a0"><pre id="c55a0"><button id="c55a0"><samp id="c55a0"></samp></button></pre></form><dfn id="c55a0"><u id="c55a0"></u></dfn><cite id="c55a0"><strike id="c55a0"><thead id="c55a0"><dl id="c55a0"></dl></thead></strike></cite><object id="c55a0"></object><nav id="c55a0"><strong id="c55a0"></strong></nav><label id="c55a0"><th id="c55a0"></th></label><var id="c55a0"></var><tbody id="c55a0"></tbody><strike id="c55a0"><dl id="c55a0"><td id="c55a0"></td></dl></strike><label id="c55a0"></label><ruby id="c55a0"><li id="c55a0"><small id="c55a0"></small></li></ruby><nav id="c55a0"></nav><dd id="c55a0"></dd><pre id="c55a0"></pre><dd id="c55a0"><xmp id="c55a0"></xmp></dd><video id="c55a0"></video><center id="c55a0"></center><tbody id="c55a0"></tbody><tr id="c55a0"></tr><ins id="c55a0"><ul id="c55a0"><u id="c55a0"><object id="c55a0"></object></u></ul></ins><label id="c55a0"><th id="c55a0"></th></label><menu id="c55a0"><input id="c55a0"></input></menu><form id="c55a0"><div id="c55a0"><big id="c55a0"></big></div></form><legend id="c55a0"><rt id="c55a0"></rt></legend><strong id="c55a0"><menu id="c55a0"><ol id="c55a0"><pre id="c55a0"></pre></ol></menu></strong><sub id="c55a0"><center id="c55a0"><acronym id="c55a0"><strong id="c55a0"></strong></acronym></center></sub><tt id="c55a0"></tt><strike id="c55a0"><dl id="c55a0"></dl></strike><progress id="c55a0"><delect id="c55a0"><tt id="c55a0"><menu id="c55a0"></menu></tt></delect></progress><b id="c55a0"><em id="c55a0"><noframes id="c55a0"><p id="c55a0"></p></noframes></em></b><sup id="c55a0"></sup><em id="c55a0"></em><sup id="c55a0"><dl id="c55a0"></dl></sup><big id="c55a0"></big><legend id="c55a0"></legend></div> </html>