HTML5 学習メモ (2) - 要素、属性、書式設定の詳細な紹介-H5 チュートリアル-php.cn

要素は開始タグから終了タグまでの全てのコードを指します

は終了タグのない空の要素です (
タグ定義はラップされます)。 XML
はすべてのブラウザで有効ですが、実際には
を使用すると長期保証になります。

要素の内容	終了タグ	コンテンツのない HTML 要素は空要素と呼ばれます。空の要素は開始タグで閉じられます。
XHTML、	、および HTML の将来のバージョンでは、すべての要素を閉じる必要があります。	などの開始タグにスラッシュを追加することは、空の要素を閉じる正しい方法であり、HTML、XHTML、および XML で受け入れられます。

HTML要素の構文

要素

の内容は開始タグと終了タグの間の内容です

空の要素は開始タグで閉じられます

ほとんどのHTML要素は属性を持つことができます

ネストされた HTML 要素

ほとんどの HTML 要素はネストできます

<p>Hello world, <a>找度娘</a></p>

ログイン後にコピー

HTML 属性

1. タグには要素の詳細情報を提供する属性を含めることができます

2. 属性が現れるキーと値のペアの形式（例: href = "www.cnblogs.www/winsoncheung"

） 3. よく使用されるタグ属性:

:alignメソッド < body>:bgcolor 背景ボディ部分の色 :target 接続を開く場所を指定します

4. 一般属性:

class

要素のクラス名を指定します

ID 要素の一意のIDを指定しますtitle

<!DOCTYPE html><html><head>
    <meta charset="UTF-8">
    <!--id规定元素唯一ID-->
    <title id="1223">基础</title>
    <!--style规定元素的样式-->
    <style type="text/css"></style></head><body bgcolor="#5f9ea0">
    <h1 align="center">标题1</h1>
    <a href="index02.html" target="_blank">打开本地</a>
    <!--class规定元素类名-->
    <h2 class="h2ID">标题2</h2></body></html>

ログイン後にコピー

HTML格式化

文本格式化标签:

style 要素のスタイルを指定します
要素の追加情報を指定します

标签	描述
	定义粗体文本。
	定义大号字。
	定义着重文字。
	定义斜体字。
all>	定义小号字。
	定义加重语气。
	定义下标字。
	定义上标字。
	定义插入字。
	定义删除字。
	不赞成使用。使用 ~~代替。~~
	不赞成使用。使用 ~~代替。~~
	不赞成使用。使用样式（style）代替。

“计算机输出”标签:

标签	描述
	定义计算机代码。
	定义键盘码。
	定义计算机代码样本。
	定义打字机代码。
	定义变量。
</td><td style="margin-left: 30px">定义预格式文本。</td></tr><tr style="margin-left: 30px"><td style="margin-left: 30px"><<a href="//m.sbmmt.com/wiki/1059.html" target="_blank">list</a>ing></td><td style="margin-left: 30px">不赞成使用。使用 <pre class="brush:php;toolbar:false"> 代替。</td></tr><tr style="margin-left: 30px"><td style="margin-left: 30px"><plaintext></td><td style="margin-left: 30px">不赞成使用。使用 <pre class="brush:php;toolbar:false"> 代替。</td></tr><tr style="margin-left: 30px"><td style="margin-left: 30px"><xmp></td><td style="margin-left: 30px">不赞成使用。使用 <pre class="brush:php;toolbar:false"> 代替。</td></tr></tbody></table><p style="margin-left: 30px; text-align: left;"><a href="//m.sbmmt.com/wiki/231.html" target="_blank">引用</a>、引用和术语定义</p><table style="margin-left: 30px; height: 261px; width: 331px"><tbody style="margin-left: 30px"><tr style="margin-left: 30px" class="firstRow"><th style="margin-left: 30px">标签</th><th style="margin-left: 30px">描述</th></tr><tr style="margin-left: 30px"><td style="margin-left: 30px"><abbr></td><td style="margin-left: 30px">定义缩写。</td></tr><tr style="margin-left: 30px"><td style="margin-left: 30px"><acronym></td><td style="margin-left: 30px">定义首字母缩写。</td></tr><tr style="margin-left: 30px"><td style="margin-left: 30px"><address></td><td style="margin-left: 30px">定义地址。</td></tr><tr style="margin-left: 30px"><td style="margin-left: 30px"><bdo></td><td style="margin-left: 30px">定义文字方向。</td></tr><tr style="margin-left: 30px"><td style="margin-left: 30px"><blockquote></td><td style="margin-left: 30px">定义长的引用。</td></tr><tr style="margin-left: 30px"><td style="margin-left: 30px"><q></td><td style="margin-left: 30px">定义短的引用语。</td></tr><tr style="margin-left: 30px"><td style="margin-left: 30px"><cite></td><td style="margin-left: 30px">定义引用、引证。</td></tr><tr style="margin-left: 30px"><td style="margin-left: 30px"><dfn></td><td style="margin-left: 30px">定义一个定义项目。</td></tr></tbody></table><p style="margin-left: 30px; text-align: left;"> 代码示例:</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false;"><!DOCTYPE html><html><head> <meta charset="UTF-8"> <title id="1223">格式化</title></head><body> <b>My name is Winson</b> <br/> <big>Welcome to my blog~</big> <br/> <i>Hello, visitor!</i> <br/> <small>我很小, 你看不见看不见</small> <br/> <strong>太显眼了</strong> <br/> 大家好<sub>欢迎</sub>来到 <br/> 大家好<sup>欢迎</sup>来到 <br/> <ins>Come on! girls!</ins> <br/> <del>Hei! girl!</del></body></html> ログイン後にコピー以上がHTML5 学習メモ (2) - 要素、属性、書式設定の詳細な紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。関連ラベル：要素属性フォーマットソース：php.cn 前の記事：HTML5学習メモ(1) - HTML5を理解する次の記事：HTML5学習ノート(3) - HTML5のスタイル、接続、テーブルコードを詳しく解説このウェブサイトの声明この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。著者別の最新記事独自の PHP フレームワークをゼロから構築するためのビデオ資料 2023-03-15 16:54:01 PHPMailer が QQ メールボックスを使用して電子メール送信機能を完了する方法の分析例 2023-03-15 12:26:02 PHPでIMAPでメールを受信する方法の紹介 2023-03-14 18:58:01 PHP で配列の重複排除を迅速に実装する方法の例 2023-03-14 11:30:01 HTML でのタグのすべての属性の使用の概要 1970-01-01 08:00:00 PHPの基礎知識まとめ（初心者が始めるのに必要） 2023-03-16 15:20:01 JavaScript での typeof の使用の概要 1970-01-01 08:00:00 JavaScript でのconfirm() メソッドの使用の概要 1970-01-01 08:00:00 HTML5 プレースホルダー属性の詳細な紹介 1970-01-01 08:00:00 ReactJS のフォームに単一選択、複数選択、逆選択を実装する方法 1970-01-01 08:00:00 最新の問題 CSS でフローティング要素を水平ではなく垂直にスタックするにはどうすればよいですか? 片側にメインコンテンツ、もう一方に追加コンテンツがある 2 つの列を持つ Web ページを作成しようとしています。ただし、float プロパティを使用して追加の列を左に揃えているた... から 2024-04-06 20:45:26 0 2 386 Web サイトから入力要素を取得できませんそこで、Twitter から入力要素を取得しようとしていますが、それを実行すると、ノードターミナルでこのようなエラーが表示され続け、その結果、このコードによって作成されたブラウザ... から 2024-04-06 18:59:57 0 1 442 文字列を HTML コード (配列から生成) に置き換えるトップレベルのメソッド次のような文字列があるとします... $htmlPattern="Usernameis:#name#andusercompanyis#company#"; 部分... から 2024-04-06 17:40:41 0 2 410 無効な React 子要素 (見つかった: キー {clientVersion} を持つオブジェクト)。子要素のコレクションをレンダリングする場合は、代わりに配列を使用してください複数ステップのフォームを持っているのですが、送信しようとするとこのエラーが表示されます。ただし、createOrganization スケジュールを単純な形式で使用すると、機能しま... から 2024-04-06 16:25:39 0 1 346 Imagick、Adobe Photoshop、Windows の比較 - 解像度の検出 (1 センチメートルあたりのピクセル数またはインチあたりのピクセル数) これは質問ではなく、DPI がさまざまなファイル形式でどのように保存されるかについての理解を深め、なぜ DPI が機能するのかを議論する試みです。私は画像 (JPG、PNG、Tif... から 2024-04-06 16:01:27 0 1 397 関連トピック詳細> Javaで配列要素の最大値と最小値を見つける方法記事タグ属性の概要フォーマット後にデータを復元する方法フォーマット後にjsコードが実行できなくなる問題の解決方法 htmlの整形方法 MySQLのdatediff関数の使用法 orientdb PHPでのスヌーピークラスの使用法人気のおすすめ h5とは何ですかコードがわからない場合に h5 ページを作成するにはどうすればよいですか?推奨される H5 ページ制作プラットフォーム html5の新機能とは何ですか？ h5ページ制作とは h5 プログラムとミニプログラムの違いは何ですか? 人気のチュートリアル詳細> 関連するチュートリアル人気のおすすめ最新のコース最新の ThinkPHP 5.1 ワールドプレミアビデオチュートリアル (PHP エキスパートになるための 60 日間のオンライントレーニングコース) 1416684 PHP 入門チュートリアル 1: 1 週間で PHP を学ぶ 4257202 JAVA 初心者向けビデオチュートリアル 2474871 Little Turtle のゼロベースの Python 学習入門ビデオチュートリアル 503283 PHP ゼロベースの入門チュートリアル 844027 最新の ThinkPHP 5.1 ワールドプレミアビデオチュートリアル (PHP エキスパートになるための 60 日間のオンライントレーニングコース) 1416684 回の学習 JAVA 初心者向けビデオチュートリアル 2474871 回の学習 Little Turtle のゼロベースの Python 学習入門ビデオチュートリアル 503283 回の学習 Web フロントエンド開発の簡単な紹介 215253 回の学習 PSビデオチュートリアルをゼロからマスターする 876606 回の学習 [Web フロントエンド] Node.js クイックスタート 6335 回の学習海外のWeb開発フルスタックコースの完全なコレクション 4958 回の学習 Go言語実践GraphQL 4163 回の学習 550W ファンマスターが JavaScript をゼロから段階的に学習します 633 回の学習 Python マスター Mosh、基礎知識ゼロの初心者でも 6 時間で始められる 21217 回の学習最新のダウンロード詳細> ウェブエフェクト公式サイトサイト素材フロントエンドテンプレート [フォームボタン] jQuery エンタープライズメッセージフォームの連絡先コード [プレイヤーの特殊効果] HTML5 MP3 オルゴール再生効果 [メニューナビゲーション] HTML5 クールなパーティクルアニメーションナビゲーションメニューの特殊効果 [フォームボタン] jQuery ビジュアルフォームのドラッグアンドドロップ編集コード [プレイヤーの特殊効果] VUE.JS 模倣 Kugou 音楽プレーヤーコード [html5特殊効果] 古典的な HTML5 プッシュボックスゲーム [画像の特殊効果] 画像効果を追加または削減するための jQuery スクロール [フォトアルバム効果] CSS3 個人アルバムカバーホバーズーム効果 [フロントエンドテンプレート] 室内装飾クリーニングおよび修理サービス会社のウェブサイトのテンプレート [フロントエンドテンプレート] フレッシュカラーの個人履歴書ガイドページテンプレート [フロントエンドテンプレート] デザイナーのクリエイティブな仕事の履歴書 Web テンプレート [フロントエンドテンプレート] 現代のエンジニアリング建設会社のウェブサイトのテンプレート [フロントエンドテンプレート] 教育サービス機関向けのレスポンシブ HTML5 テンプレート [フロントエンドテンプレート] オンライン電子書籍ストアモールのウェブサイトテンプレート [フロントエンドテンプレート] IT テクノロジーがインターネット企業の Web サイトテンプレートを解決します [フロントエンドテンプレート] パープルスタイル外国為替取引サービスウェブサイトテンプレート [PNG素材] かわいい夏の要素のベクター素材 (EPS+PNG) [PNG素材] 4 つの赤い 2023 卒業バッジベクター素材 (AI+EPS+PNG) [バナー画像] 歌う鳥と花がいっぱいのカートデザイン春のバナーベクター素材（AI+EPS） [PNG素材] 金色の卒業帽ベクター素材（EPS+PNG） [PNG素材] 黒と白のスタイルの山アイコンベクター素材 (EPS+PNG) [PNG素材] 異なる色のマントと異なるポーズを持つスーパーヒーローのシルエットベクター素材（EPS+PNG） [バナー画像] フラットスタイルの植樹祭バナーベクター素材 (AI+EPS) [PNG素材] 9つのコミックスタイルの爆発するチャットバブルベクター素材（EPS+PNG） [フロントエンドテンプレート] 室内装飾クリーニングおよび修理サービス会社のウェブサイトのテンプレート [フロントエンドテンプレート] フレッシュカラーの個人履歴書ガイドページテンプレート [フロントエンドテンプレート] デザイナーのクリエイティブな仕事の履歴書 Web テンプレート [フロントエンドテンプレート] 現代のエンジニアリング建設会社のウェブサイトのテンプレート [フロントエンドテンプレート] 教育サービス機関向けのレスポンシブ HTML5 テンプレート [フロントエンドテンプレート] オンライン電子書籍ストアモールのウェブサイトテンプレート [フロントエンドテンプレート] IT テクノロジーがインターネット企業の Web サイトテンプレートを解決します [フロントエンドテンプレート] パープルスタイル外国為替取引サービスウェブサイトテンプレート私たちについて免責事項 Sitemap PHP中国語ウェブサイト：福祉オンライン PHP トレーニング，PHP 学習者の迅速な成長を支援します！