学習html(6)

3979 ワード

1.html学習思考ガイド
doctypeドキュメントタイプ宣言.
headブラウザ、検索エンジンを見てください.
body各種ラベル.
div様々なレイアウトは上から下へ、左から右へ、大きいから小さいまでです.
ボックスモデルのさまざまなプロパティフローティングレイアウト.
CSS効果1.セレクタ2.制御効果:段落制御、文字制御、背景制御3.導入方式:4種類4.初期化
htmlタグ無意味タグには意味タグがあります.

2.hラベルとpラベル
hラベル:h 1からh 6まで、等級の異なるタイトル、大きさが異なり、テキストの異なる位置を表し、サブがますます小さくなっている.
pラベル:pは段落を表し、ニュースでは一般的にhとpがよく一緒に現れ、各セグメントの内容を表す.

3.img画像ラベル

自閉とラベル、srcは画像ファイルのパス(絶対パスと相対パス)を導入します.altは画像情報を表示し、ブラウザに見せるだけでなく、人に見せる.titleマウスを置くと、効果が表示されます.
同時にsrcを通じて他のサイトの画像を盗むことができます.例えば、http://address.jpg他のサイトの画像にインデックスします.

4.imgはインライン元素かブロック元素か
インライン要素は改行せず、ブロック要素は改行する必要があります.
imgは改行しないので、インライン要素です.しかし、特殊なインライン要素であり、インライン置換要素(replaced element)であり、本当の内容は画像そのものから来ている.
一般的に初期化するときは、画像をブロック状に設定し、display:blockしてから、対応するブロック要素に対応して処理します.

5.整列リストと無秩序リスト
無秩序リスト:

list-style-type:cricle;中空円
list-style-type:square;四角形
シーケンステーブル:

があります.
list-style-type:upper-roman;ローマ文字
しかし、一般的にlist-style-typeはnoneであり、異なるブラウザのために互換性を維持している.
liに背景画像を付けることで、前の小さなアイコンを追加し、表示効果を増やします.

6.整然とした表
表:

行:
列:
表はCSSで枠線を設定する必要があります.
border-collapse:separate(デフォルト独立)とcollapse(破列融合の設定)、tableで設定し、枠線を分割して融合します.
border-spacing:デフォルトの枠線距離.
colspan="4"は、4列にまたがってtdに設定されます.
Rowspan="4"は、4行にまたがってtdに設定されています.

7.table実践、カリキュラム

<!DOCTYPE html>
<html>
<head>
<title>table   </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
table{
        border-collapse:collapse;
}	
td{
        border: 2px solid blue;
        width: 70px;
        height: 15px;
        text-align: center;
}
</style>
</head>
    <body>
    	<table>
                      <tr>
                             <td>    </td>
                             <td>1</td>
                             <td>2</td>
                             <td>3</td>
                             <td>4</td>
                             <td>5</td>
                      </tr>
                      <tr>
                            <td rowspan="2">  </td>
                            <td>  </td>
                            <td>  </td>
                            <td>  </td>
                            <td>  </td>
                            <td>  </td>
                     </tr>
                     <tr>
                            <td>  </td>
                            <td>  </td>
                            <td>  </td>
                            <td>  </td>
                            <td>  </td>
                     </tr>
                     <tr >
                        <td colspan="6"></td>
                     </tr>

                      <tr>
                            <td rowspan="2">  </td>
                            <td>  </td>
                            <td>  </td>
                            <td>  </td>
                            <td>  </td>
                            <td>  </td>
                     </tr>
                      <tr>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                     </tr>
          </table>
    </body>
</html>

Djangoラーニング(五)-静的ファイル

スプリングプレート(補強)-計ニンニク客