WEB

代表的なタグの種類

<html>
HTMLを宣言します。


<html lang=”ja”></html>

 


<head>
ヘッダ情報を指定します。


<head></head>


<meta>
文字エンコードなどを指定します。


<meta http-equiv=”Content-Type” content=”text/html; charset=Shift_JIS”>

 


<title>
タイトルを指定します。


<title>タイトル</title>

 

 

<h1><h6>
<h></h>で囲むことによって見出しを表します。
hの後の数字が小さいものほど(階層が)大きい見出しとなります。


<h1>これは見出し1です。</h1>
<h2>これは見出し2です。</h2>

 Webでの表示↓

f:id:wacme:20200805154026p:plain

 


<p>
<p></p>で囲むことによって段落を表します。


<p>これは段落1です。</p>
<p>これは段落2です。</p>

 Webでの表示↓

f:id:wacme:20200805154407p:plain

 


<br>
<br>を記述したところで改行します。

ここで<br>
文章を改行します。

 Webでの表示↓

f:id:wacme:20200805154618p:plain

 

 

<a>
<a></a>で囲むことによってリンクを埋め込みます。
href属性と併せて使用することでリンク先を指定できます。

このブログへのリンクは<a href="〇〇〇">こちら</a>です。

 Webでの表示↓

f:id:wacme:20200805155031p:plain



<img>
<img>タグは画像(image)を貼る際に使用します。

基本的には、src属性に画像のファイル名(PNGやGIF、JPEG形式など)を指定することにより、画像を表示させます。
また、必須ではありませんがalt属性に代替テキストを与えることにより、万が一画像が表示されない環境時に代わりにテキストを表示させることができます。

<img src="sea.jpg" alt="海">
Webでの表示↓

f:id:wacme:20200805162223p:plain

画像が上手く表示されなかった場合↓

f:id:wacme:20200805162429p:plain

 

 

<li>
リストを指定します。

 


<ol>
<li>と組み合わせて、番号付きリストを指定します。


<ol>
 <li>1番</li>
 <li>2番</li>
 <li>3番</li>
</ol>

 Webでの表示↓

f:id:wacme:20200805163942p:plain

 

<ul>
<li>と組み合わせて、特に順序のない箇条書きリストを指定します。


<ul>
 <li>1番</li>
 <li>2番</li>
 <li>3番</li>
</ul>

 Webでの表示↓

f:id:wacme:20200805165259p:plain

 

 

<table>
表を指定します。

 

<tr>
表の中の行を指定します。


<th>
表の中の見出しを指定します。


<td>
表の中のセルを指定します。

 


<table border="1">
 <tr>
  <th>国名</th> <th>言語</th> <th>人口</th>
 </tr>
 <tr>
  <td>日本</td> <td>日本語</td> <td>1億人</td>
 </tr>
 <tr>
  <td>アメリカ</td> <td>英語</td> <td>3億人</td>
 </tr>
 <tr>
  <td>中国語</td> <td>中国語</td> <td>13億人</td>
 </tr>
</table>

 Webでの表示↓

f:id:wacme:20200805174722p:plain

 

 

<dl>
説明リストを指定します。

 

<dt>
説明リスト内の用語を指定します。

 

<dd>
説明文を指定します。

 
<dl>
 <dt>開始時間</dt>
  <dd>AM9:00</dd>
 <dt>終了時間</dt>
 <dd>PM17:00</dd>

 <dl>

Webでの表示↓

f:id:wacme:20200805180603p:plain