1. Web ページを検索エンジンがよりよく理解できるようにする
タグの目的: Web ページの制作を学ぶときに、よく耳にする言葉です。セマンティック。では、セマンティクスとは何でしょうか? 簡単に言うと、各タグの目的を理解することです (たとえば、Web ページ上の記事のタイトルには title タグを使用できます)。また、Web ページ上の各列のタイトルタグも名前に使用できます。記事内のコンテンツの段落は段落タグ内に配置する必要があります。記事内で強調したいテキストがある場合は、em タグを使用して強調などを表現できます。
セマンティクスについてたくさん話してきましたが、セマンティクスはどのような利点をもたらすのでしょうか?
- 検索エンジンによってインデックスされやすくなります。
- スクリーン リーダーが Web コンテンツを読みやすくします。
2. タグ、Web ページに表示されるコンテンツがここに配置されます。
例:
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>了不起的盖茨比</title></head><body> <h1 id="了不起的盖茨比">了不起的盖茨比</h1> <p>1922年的春天，一个想要成名名叫<em>尼克•卡拉威</em>（托比•马奎尔Tobey Maguire 饰）的作家，离开了美国中西部，来到了纽约。那是一个道德感渐失，爵士乐流行，走私为王，股票飞涨的时代。为了追寻他的<span>美国梦</span>，他搬入纽约附近一海湾居住。</p> <p>菲茨杰拉德，二十世纪美国文学巨擘之一，兼具作家和编剧双重身份。他以诗人的敏感和戏剧家的想象为<strong>"爵士乐时代"</strong>吟唱华丽挽歌，其诗人和梦想家的气质亦为那个奢靡年代的不二注解。</p></body></html>
効果は次のとおりです。
HTML_BODY_LABEL
3.
タグの学習を開始し、段落を追加します
Web ページに記事を表示する場合は、
タグが必要なので、記事の段落を
タグ内に置きます。
文法:
段落テキスト
ニュース記事にテキストの段落が 2 つある場合は、その 2 つの段落を配置する必要があることに注意してください。 2 つのタグについては、セクション 2 のコードを参照してください。
タグのデフォルトのスタイルは、セクション 2 の図で確認できます。この空白が気に入らない場合は、CSS スタイルを使用して削除または変更できます。
4. タグを理解して Web ページにタイトルを追加します。
記事の段落では
タグを使用する必要があります。記事のタイトルは？このセクションでは、 は最高レベルです。構文:
Tencent
.
5. 必要に応じて、 タグと タグを使用します。段落内の特定の単語を強調するには、 または タグを使用します。ただし、強調の調子には違いがあります。 は強調を意味し、 はより強い強調を意味します。ブラウザでは、 はデフォルトで斜体で表現され、 は太字で表現されます。 2 つのタグと比較して、国内のフロントエンド プログラマは現在、強調を表現するために を使用することを好みます。
Gramtax: 強調する必要があるテキスト強調する必要があるテキスト
6. テキスト用に個別のスタイルを設定します
3 つのタグ 、、 をまとめてみましょう:
- ;strong> タグは段落内のキーワードを強調するために使用され、その意味は強調です。
-
構文: text
<p>1922年的春天，一个想要成名名叫<em>尼克•卡拉威</em>（托比•马奎尔Tobey Maguire 饰）的作家，离开了美国中西部，来到了纽约。那是一个道德感渐失，爵士乐流行，走私为王，<strong>股票</strong>飞涨的时代。为了追寻他的<span>美国梦</span>，他搬入纽约附近一海湾居住。</p>语法：
7. のような短いテキスト引用符
を追加しますあなたのHTMLへの引用?たとえば、Web ページの記事で特定の作家の詩を引用し、記事をより目立つものにしたい場合は、 タグが必要です。
文法:
引用テキスト
次の例のように:
説明:
<p>最初知道庄子，是从一首诗<q>庄生晓梦迷蝴蝶。望帝春心托杜鹃。</q>开始的。虽然当时不知道是什么意思，只是觉得诗句挺特别。后来才明白这个典故出自是庄子的《逍遥游》，《逍遥游》代表了庄子思想的最高境界，是对世俗社会的功名利禄及自己的舍弃。</p>
- 上記の例では、「荘盛の暁の夢は蝶に執着する。皇帝の春の心はカッコウに託される。」は、後期唐の詩人、李尚音の『晋世』の詩です。 。著者自身の文章ではないため、引用には を使用する必要があります。
注意：这里用标签的真正关键点不是它的默认样式双引号（如果这样我们不如自己在键盘上输入双引号就行了），而是它的语义：引用别人的话。
8、标签，长文本引用
的作用也是引用别人的文本。但它是对长文本的引用，如在文章中引入大段某知名作家的文字，这时需要这个标签。等等，上一节
标签不是也是对文本的引用吗？不要忘记标签是对简短文本的引用，比如说引用一句话就用到标签。如想在我的文章中引用李白《关山月》中的诗句，因为引用文本比较长，所以使用
。语法:
<blockquote>引用文本</blockquote>如下面例子：
<blockquote>明月出天山，苍茫云海间。长风几万里，吹度玉门关。汉下白登道，胡窥青海湾。由来征战地，不见有人还。 戍客望边色，思归多苦颜。高楼当此夜，叹息未应闲。</blockquote>浏览器对
标签的解析是缩进样式。9、使用标签分行显示文本
怎么可以让每一句诗词后面加入一个折行呢？那就可以用到<br>标签了，在需要加回车换行的地方加入<br>，<br>标签作用相当于word文档中的回车。语法：xhtml1.0写法：
<br />html4.01写法：
<br>大家注意，现在一般使用 xhtml1.0 的版本的写法（其它标签也是），这种版本比较规范。
与以前我们学过的标签不一样，<br>标签是一个空标签，没有HTML内容的标签就是空标签，空标签只需要写一个开始标签，这样的标签有<br>、
和。
讲到这里，你是不是有个疑问，想折行还不好说嘛，就像在 word 文件档或记事本中，在想要折行的前面输入回车不就行了吗？很遗憾，在 html 中是忽略回车和空格的，你输入的再多回车和空格也是显示不出来的。如下边的代码。
总结：在 html 代码中输入回车、空格都是没有作用的。在html文本中想输入回车换行，就必须输入<br>。
10、为你的网页中添加一些空格
在上一节的例子，我们已经讲解过在html代码中输入空格、回车都是没有作用的。要想输入空格，必须写入。
语法：
11、认识
标签，添加水平横线在信息展示时，有时会需要加一些用于分隔的横线，这样会使文章看起来整齐些。语法：
html4.01版本
xhtml1.0版本
注意：
1.
标签和<br>标签一样也是一个空标签，所以只有一个开始标签，没有结束标签。2.
标签的在浏览器中的默认样式线条比较粗，颜色为灰色，可能有些人觉得这种样式不美观，没有关系，这些外在样式在我们以后学习了css样式表之后，都可以对其修改。
- 大家注意，现在一般使用 xhtml1.0 的版本（其它标签也是），这种版本比较规范。
12、标签，为网页加入地址信息
一般网页中会有一些网站的联系地址信息需要在网页中展示出来，这些联系地址信息如公司的地址就可以
标签。也可以定义一个地址（比如电子邮件地址）、签名或者文档的作者身份。语法：
<address>联系地址信息</address>如：
<address>文档编写：lilian 北京市西城区德外大街10号</address><address>本文的作者：<a href="mailto:lilian@imooc.com">lilian</a></address>在浏览器上显示的样式为斜体，如果不喜欢斜体，当然可以，可以在后面的课程中使用 css 样式来修改它
标签的默认样式。13、想加入一行代码吗？使用
标签在介绍语言技术的网站中，避免不了在网页中显示一些计算机专业的编程代码，当代码为一行代码时，你就可以使用
标签了，如下面例子：<code>var i=i+300;</code>注意：在文章中一般如果要插入多行代码时不能使用
标签了。语法：
<code>代码语言</code>注：如果是多行代码，可以使用
标签。14、使用
标签为你的网页加入大段代码语法：
<pre class="brush:php;toolbar:false">语言代码段标签的主要作用:预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。 <hr> <p> </p><p></p>
HTML、CSS、およびJavaScriptの未来：Web開発動向Apr 19, 2025 am 12:02 AMHTMLの将来の傾向はセマンティクスとWebコンポーネントであり、CSSの将来の傾向はCSS-in-JSとCSShoudiniであり、JavaScriptの将来の傾向はWebAssemblyとServerLessです。 1。HTMLセマンティクスはアクセシビリティとSEO効果を改善し、Webコンポーネントは開発効率を向上させますが、ブラウザの互換性に注意を払う必要があります。 2。CSS-in-JSは、スタイル管理の柔軟性を高めますが、ファイルサイズを増やす可能性があります。 CSShoudiniは、CSSレンダリングの直接操作を可能にします。 3. Webassemblyブラウザーアプリケーションのパフォーマンスを最適化しますが、急な学習曲線があり、サーバーレスは開発を簡素化しますが、コールドスタートの問題の最適化が必要です。
HTML：構造、CSS：スタイル、JavaScript：動作Apr 18, 2025 am 12:09 AMWeb開発におけるHTML、CSS、およびJavaScriptの役割は次のとおりです。1。HTMLは、Webページ構造を定義し、2。CSSはWebページスタイルを制御し、3。JavaScriptは動的な動作を追加します。一緒に、彼らは最新のウェブサイトのフレームワーク、美学、および相互作用を構築します。
HTMLの未来：ウェブデザインの進化とトレンドApr 17, 2025 am 12:12 AMHTMLの将来は、無限の可能性に満ちています。 1）新機能と標準には、より多くのセマンティックタグとWebComponentsの人気が含まれます。 2）Webデザインのトレンドは、レスポンシブでアクセス可能なデザインに向けて発展し続けます。 3）パフォーマンスの最適化により、応答性の高い画像読み込みと怠zyなロードテクノロジーを通じてユーザーエクスペリエンスが向上します。
HTML対CSS対JavaScript：比較概要Apr 16, 2025 am 12:04 AMWeb開発におけるHTML、CSS、およびJavaScriptの役割は次のとおりです。HTMLはコンテンツ構造を担当し、CSSはスタイルを担当し、JavaScriptは動的な動作を担当します。 1。HTMLは、セマンティクスを確保するためにタグを使用してWebページの構造とコンテンツを定義します。 2。CSSは、セレクターと属性を介してWebページスタイルを制御して、美しく読みやすくします。 3。JavaScriptは、動的でインタラクティブな関数を実現するために、スクリプトを通じてWebページの動作を制御します。
HTML：それはプログラミング言語か何か他のものですか？Apr 15, 2025 am 12:13 AMhtmlisnotaprogramminglanguage; itisamarkuplanguage.1）htmlStructuresandformatswebcontentusingtags.2）ItworkswithcsssssssssdjavascriptforInteractivity、強化を促進します。
HTML：Webページの構造の構築Apr 14, 2025 am 12:14 AMHTMLは、Webページ構造の構築の基礎です。 1。HTMLは、コンテンツ構造とセマンティクス、および使用などを定義します。タグ。 2. SEO効果を改善するために、などのセマンティックマーカーを提供します。 3.タグを介したユーザーの相互作用を実現するには、フォーム検証に注意してください。 4. JavaScriptと組み合わせて、動的効果を実現するなどの高度な要素を使用します。 5.一般的なエラーには、閉じられていないラベルと引用されていない属性値が含まれ、検証ツールが必要です。 6.最適化戦略には、HTTP要求の削減、HTMLの圧縮、セマンティックタグの使用などが含まれます。
テキストからウェブサイトへ：HTMLの力Apr 13, 2025 am 12:07 AMHTMLは、Webページを構築するために使用される言語であり、タグと属性を使用してWebページの構造とコンテンツを定義します。 1）htmlは、などのタグを介してドキュメント構造を整理します。 2）ブラウザはHTMLを分析してDOMを構築し、Webページをレンダリングします。 3）マルチメディア関数を強化するなど、HTML5の新機能。 4）一般的なエラーには、閉じられていないラベルと引用されていない属性値が含まれます。 5）最適化の提案には、セマンティックタグの使用とファイルサイズの削減が含まれます。
HTML、CSS、およびJavaScriptの理解：初心者向けガイドApr 12, 2025 am 12:02 AMwebdevelopmentReliesOnhtml、css、andjavascript：1）htmlStructuresContent、2）cssStylesit、および3）Javascriptaddsinteractivity、形成、
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
AI Hentai Generator
AIヘンタイを無料で生成します。
人気の記事
ホットツール
メモ帳++7.3.1
使いやすく無料のコードエディター
SecLists
SecLists は、セキュリティ テスターの究極の相棒です。これは、セキュリティ評価中に頻繁に使用されるさまざまな種類のリストを 1 か所にまとめたものです。 SecLists は、セキュリティ テスターが必要とする可能性のあるすべてのリストを便利に提供することで、セキュリティ テストをより効率的かつ生産的にするのに役立ちます。リストの種類には、ユーザー名、パスワード、URL、ファジング ペイロード、機密データ パターン、Web シェルなどが含まれます。テスターはこのリポジトリを新しいテスト マシンにプルするだけで、必要なあらゆる種類のリストにアクセスできるようになります。
PhpStorm Mac バージョン
最新(2018.2.1)のプロフェッショナル向けPHP統合開発ツール
AtomエディタMac版ダウンロード
最も人気のあるオープンソースエディター
ZendStudio 13.5.1 Mac
強力な PHP 統合開発環境
