HTMLとCSSの旅(8)

HTMLのいろいろな要素を取り扱おう(2)

ブログを書く前に色々HTMLについてしらべていたのですが、CSSの方がHTMLでいう要素みたいなものがたくさんあったので、このブログでHTMLの要素について終わらせたいと思います。そしてCSSもやってPythonでWebアプリを作れたらなって思います。

<ol>

<ul>と違って順序のあるリストを作るタグです。
属性にstarttypeがあります。

<ol type="i">
   <li>リスト1</li>
   <li>リスト2</li>
</ol>
  1. リスト1
  2. スト2

typeには1, A, a, Iが入ります。また何も入れない場合は1扱いとなります。

<ol start="5" type="a">
   <li>リスト1</li>
   <li>リスト2</li>
</ol>
  1. リスト1
  2. スト2

startには始めたいところの番号を入れます。typeがなんであろうとstartに入るのは数字であることに気をつけてください。

<ul>

こちらは前も紹介した通りの順序のないリストを作るタグです。
属性にはtypeがあって、disc(黒丸), circle(白丸), square(四角)が入ります。

<ul type="square">
   <li>リスト1</li>
   <li>リスト2</li>
<ul>
<li>

リストの項目を表示するタグです。
属性にはtypevalueがあります。
typeにはdisc, circle, square, 1, A, a, Iが入るのですが、disc, circle, squareは<ul>~</ul>と中のとき、1, A, a, Iは<ol>~</ol>の中のときです。またvalueは数字しか入らず、<ol>内のときに使い、項目番号の変更をします。

<ol>
   <li type="A" value="3">リスト1</li>
   <li type="a" value="3">リスト2</li>
</ol>
  1. リスト1
  2. スト2

こんな風にリスト内容それぞれに指定することができます。

<ul>
   <li type="disc">リスト1</li>
   <li type="circle">リスト2</li>
   <li type="square">リスト3</li>
</ul>
<dl> <dt> <dd>

定義リストを表すタグです。

<dl>
   <dt>用語</dt>
   <dd>用語の説明</dd>
</dl>
用語
用語の説明
<img>

画像を表示させるタグです。属性はたくさんあるので主に使うもの紹介します。
具体的には次のコードをみてください。

<p><img src="画像URL" alt="表示できない場合の代替テキスト" height="高さ" width="幅" 
align="画像とテキストの位置関係">サンプル</p>

画像を表示できませんサンプル

 

 

 

 

 

 

この画像は次のように表示させました。

<p><img src="https://upload.wikimedia.org/wikipedia/commons/9/9e/Flag_of_Japan.svg" 
alt="画像を表示できません" width="400" height="300" align="right">サンプル</p>
<hr>

水平の横線を引くタグです。

属性にはsize width align noshadeの4つがあります。

<hr size="太さ" width="長さ" align=""表示位置" noshade="">

noshadeは立体感をなくすことができます。

<s>

<del>と同様に打ち消し線をつくるタグです。正確では無くなった情報などに使います。

<s>打ち消し線が作られます。</s>

打ち消し線が作られます。

<u>

アンダーラインを引くためのタグです。

<u>アンダーラインを引きます。</u>

アンダーラインを引きます。

<i>

文字をイタリック体で表示します。

<p>文字を<i>イタリック体</i>で表示します。</i>

文字をイタリック体で表示します

<b>

文字を太文字にするタグです。

<p><b>太</b>文字</p>

文字

 

最後に

ひとまずこれで終わりにしたいと思います。しかし、まだ触れてないとこがあって、触れたいんですが自分の知識不足で今やってもなんの役にも立たないと思いましたので、先にCSSに移りたいと思います。もうすぐ夏休みが終わってしまい、この夏休みを無駄にした気しかしません。最初から始めればもっと勉強状態も進歩したと思います。なので、学校が始まってからも一週間に一個ブログを完成させたいと思います。CSSが終わったらPythonDjangoに手を出し、それについてもブログでかけたらいいと思っています。とりあえず、CSSの勉強が終わるまでは一週間に一個のブログを書きたいと思います。