ホームページ > ウェブフロントエンド > htmlチュートリアル > HTML の学習方法を説明する記事

HTML の学習方法を説明する記事

迷茫
リリース: 2017-01-23 14:01:08
オリジナル
1221 人が閲覧しました

html は、Web ページの作成を学ぶための基礎です。この記事を読んだ後は、HTML をさらに理解して練習するだけです。アーティスト、開発者は HTML を読み、必要に応じて簡単な変更を加えることができます。この記事が HTML を理解するのに役立つように、以下の私の考えに従ってください。もちろん、理解が深まるように、読む過程で自分で試してみることをお勧めします。では、始めましょう: (以下の記号はすべて英語で入力されています)

1. HTML の基本ルール

<html>
<head>
<title>我的网页</title>
………………………..
</head>
<body>
………………….
</body>
</html>
ログイン後にコピー

これは、Web ページに必須のマークです。 < > 内に配置され、 で終わりますが、楕円内に多くの厄介な要素が追加されています。

上記のコードをメモ帳にコピーし、.html ファイルとして保存してください。それから、ホームページの前後にマーク を追加します。 ;a href= "#">ホームページ、保存して効果をもう一度確認しますか?

それらは、インターネットをサーフィンするときに通常目にするハイパーリンクですか?ここで「ホーム」をクリックしても変化はありません。追加した空の接続はアイロンが熱いうちに打つためです。前の方法に従ってページを作成し、b.html として保存し、上の「#」を b.html にして開き、ホームページをクリックするとページ b にジャンプします。 (もちろん、ページ a と b は同じディレクトリに存在する必要があります。) ここまでで、実際には、Web ページ上のすべての機能が、必要な場合に と同様の異なるタグによって実装されていることを理解する必要があります。これらのタグの機能を覚えておいてください。

2. Web ページの構造

インターネットをサーフィンするときに注意してみると、Web ページは実際にはブロックに分割されています

必要に応じて多くのブロックに分割することもできます。ブロックの主な目的は変更することです。それぞれのパフォーマンススタイルを決定します。

これは主に

タグを追加してみましょう:

<div>
<a href=”b.html”>首页</a>
</div>
ログイン後にコピー

それを保存して開いてみてください。

それは変更前と同じですか? それにいくつかの変更を加えてみましょう:

<div style=”width:200px;height:100px;border-style:solid;” >
ログイン後にコピー

が実行されており、マークした領域は青い背景で表示されます。

ブロック (笑) をたくさん追加して、Web ページを 8 つの部分に分割し、各ブロックに必要なものを入れることができます。

もちろん、多くの

は を追加します。これらのスタイル設定が似ている場合、通常、スタイルを別の .css ファイル (コントロール Web ページ) に入れるのは面倒です。 (各タグの表示スタイル) そして、呼び出す必要がある場所で呼び出しを行ってみましょう

新しいメモ帳を作成し、名前を c.css に変更して開き、次のように記述します:

#header{width:200px;height:100px;border-style:solid;}
ログイン後にコピー

HTML の

を削除し、

の前に追加します。つまり、ファイル c. cssを導入してください。 CSS を別のファイルに入れる利点は、このスタイルが多くの場所で参照されている場合、この 1 か所を変更するだけですべてが変更されることです。そうでない場合は、各場所を手動で変更する必要があり、後の作業に役立ちません。メンテナンス。

最後に、a.html の

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート