HTML主要コード一覧表

以下にHTMLの基本的なタグと要素を表形式でまとめました。

タグ	説明	使用例
<html>	HTML文書の開始と終了を定義	<html>...</html>
<head>	メタ情報を含むヘッダー部分	<head>...</head>
<title>	ページのタイトル	<title>ページタイトル</title>
<body>	文書の本文部分	<body>...</body>
<h1> ～ <h6>	見出し（レベル1～6）	<h1>大見出し</h1>
<p>	段落	<p>テキスト段落</p>
<a>	ハイパーリンク	<a href="URL">リンクテキスト</a>
<img>	画像の挿入	<img src="画像.jpg" alt="代替テキスト">
<div>	ブロックレベル要素のグループ化	<div>...</div>
<span>	インライン要素のグループ化	<span>...</span>
<ul>	順序なしリスト	<ul><li>項目</li></ul>
<ol>	順序付きリスト	<ol><li>項目</li></ol>
<li>	リスト項目	<li>リスト項目</li>
<table>	テーブル	<table>...</table>
<tr>	テーブル行	<tr>...</tr>
<td>	テーブルセル	<td>セル内容</td>
<form>	フォーム	<form>...</form>
<input>	入力フィールド	<input type="text">
<button>	ボタン	<button>クリック</button>
<br>	改行	<br>

基本的なHTML文書の構造例：

html
1<!DOCTYPE html>
2<html>
3<head>
4    <meta charset="UTF-8">
5    <title>ページタイトル</title>
6</head>
7<body>
8    <h1>メインタイトル</h1>
9    <p>これは段落です。</p>
10    <div>
11        <img src="image.jpg" alt="画像">
12        <a href="https://example.com">リンク</a>
13    </div>
14</body>
15</html>

よく使用される属性：

class: CSSのクラス名を指定
id: 要素の一意の識別子
style: インラインCSS
src: 画像やスクリプトのソースURL
href: リンク先URL
alt: 画像の代替テキスト
type: 入力フィールドの種類
name: フォーム要素の名前
value: フォーム要素の値

他のプロンプトもチェック

画像生成
キャラクター作成
推奨モデル - Midjourney
【プロンプト公開】　水着美女生成
初心者でも簡単！公開プロンプトを使って、オリジナルの水着美女を生成してみませんか？ #SNS #Instagram #X #Twitter #TikTok #ChatGPT #画像生成 #マーケティング
1
0
12
852
AIの先生 | OMG-okinawa
GPTs
キャラクター作成
花押クリエイター
花押クリエイターは、日本の伝統的な署名や印「花押」のデザインをサポートするためのツールです。国内外のさまざまな文化背景を考慮し、名前やシンボルを基にした個性的で芸術的な花押デザインを提案します。このツールは、歴史的な作法や文化的背景を尊重しながら、現代的なアプローチにも対応します。作成した花押のコンセプトや意図を分かりやすく説明し、カスタマイズや調整も簡単に行うことが出来ます。初めての方から花押愛好家まで、どなたでもご利用いただける「花押クリエイター」で、あなただけの特別なデザインを作りませんか？　GPTsストアで高評価していただけると嬉しいです。 #画像作成 #花押　#サイン
7
2
4.63K
10.2K
shimasang
GPTs
キャラクター作成
「なんでもナスビに変えちゃう！」魔法をかけるよ☆妖精アーヤちゃん
【ナスビ好き集合～！】キーワード・写真画像をなんでもナスビモチーフに変更しちゃうGptsだよ。＜ストーリー＞ AI研究「アーヤラボ」のサロンオーナー妖精アーヤちゃん。アーヤラボのメンバーであるラボメンたちの最近のブームは「ナスビ画像を生成すること」。わけがわからん。しかし、流行ってしまったのだ。その名も「ナスバトン」。バトンを受け取った人は前の人よりも多くのナスを画像生成するといったバトンだ。１本のナスから始まり、それはどんどん膨れ上がり、ついに16,398,474,123,698,300本のナスに増えてしまった。妖精アーヤはそのバトンのアンカーを託された。もうこれは…　Gptsで、ナスを、みんなに消費してもらうしかない！！！そんなわけで、アーヤのGptsを使って、みんなでおいしくナスをいただきましょうね。
13
0
65
231
妖精アーヤ
キャラクター作成
VTuberっぽい名前生成
VTuberみたいな名前を生成します。
0
6
450
9.12K
アディラス

Makedown形式について解説してくれるAI！！

HTML主要コード一覧表

コメント 0

他のプロンプトもチェック