ホームページ ウェブフロントエンド htmlチュートリアル 初心者の独習 Web サイト構築 HTML レッスン 3 初めての Web ページの作成_html/css_WEB-ITnose

初心者の独習 Web サイト構築 HTML レッスン 3 初めての Web ページの作成_html/css_WEB-ITnose

Jun 24, 2016 pm 12:07 PM

前回のレッスンでは、Dreamweaver の作業インターフェイスについて学びました。このレッスンから、Web ページの制作を浅いところから深いところまで学び始めます。

まず、Dreamweaver を開きます。Web ページを作成するには、原稿を書くために紙が必要なように、まず新しいドキュメントを作成する必要があります。

キャリア上でのみ作成できるため、今日学習したい最初の知識ポイントは、ドキュメントを作成および保存するいくつかの方法です。

まず、新しいドキュメントを作成する 3 つの方法について説明します:

図には、新しいドキュメントを作成する 3 つの方法がリストされています。

新規: ショートカット キー (Ctrl+N)。

ドキュメントを保存するいくつかの方法について説明しましょう:

保存: ショートカット キー (Ctrl+S)

名前を付けて保存: ショートカット キー (Ctrl+Shift+S)

Web ページを作成する良い習慣: いつでも 予期しない要因 (ブレークポイント、クラッシュなど) によってドキュメントのコンテンツが失われるのを防ぐために、ドキュメントを保存します。

2 番目の知識ポイント: 初めての Web ページの作成。

私の最初のブログ投稿 (Web サイト初心者必読) を例として、それを Web ページに作成します。

ブログ投稿アドレス:

1,000 以上の単語がありますが、それを Web ページにどのように組み込むのですか?

私が最初に思いつくのは: 1. 手動入力。たったの 1,000 語ですので、大したことはありません。

OK、5 分で完了です。

しかし、ある日職場で上司から、数万語の文書を 5 分で Web ページに変換するように頼まれたとしたら、あっという間にです。そうするとこの方法は絶対に無理です。

そこで、前のクラスでさまざまなメニューに慣れてきたときに見たようなインポート関数を思い出しました。ドキュメントを Web ページに直接インポートできますか?

2. Word ドキュメントを Web ページにインポートします。

まず、新しい Word 文書を作成します。

ブログ投稿を Word 文書にコピーします。

Dreamweaver のファイル メニュー [インポート] Word ドキュメントをクリックします。

数秒で完了です。

他の方法はありますか?コピー&ペーストするだけでいいでしょうか?試してみる!

ブログ投稿のコンテンツを選択し、右クリックしてコピーします。

編集メニューをクリックし、[貼り付け]をクリックします。

OK、それもできます。

そのコードを見てみましょう:

各段落は

XXXXXX

で構成されていることがわかります。この

は何を意味しますか?

w3school を開き、HTML 要素をクリックすると、次の説明が表示されます:

要素:

これは私の最初の段落です。

This

この要素には開始タグ

と終了タグ

があります。

要素の内容は次のとおりです: これは私の最初の段落です。

は段落記号だそうです。中国語で「始まりと終わり」という言葉があるので、Web ページを書くときは終了タグ

を書くことを忘れないでください。 。

Web ページ作成の良い習慣: タグはペアで記述する必要があります: (

、 など)

Web ページ作成の良い習慣: タグは必ずペアで記述してください小文字で書くこと。

Web ページに名前を付けます。

1. ドキュメント ツールバーとタイトルで Web ページのタイトルを変更します。

2. コード でページのタイトルを変更します。

ドキュメントを保存し、myfirstweb という名前を付け、Web フォルダーの下に保存します: (読者は保存するフォルダーと名前を付ける独自のフォルダーを選択できます)

注: ドキュメント名は文字または数字にする必要があり、下線は付けません。ましてや漢字にちなんだ名前です。

ダブルクリックして myfirstweb.html を開きます

最初の Web ページが完成しました。

最初の Web ページが完成しました。

(追加: Word ドキュメントのインポート ボタンが灰色の場合、Word ソフトウェアがインストールされていないことが原因であるはずです。)

by??Midnight Cat

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

HTMLは初心者のために簡単に学ぶことができますか? HTMLは初心者のために簡単に学ぶことができますか? Apr 07, 2025 am 12:11 AM

HTMLは、簡単に学習しやすく、結果をすばやく見ることができるため、初心者に適しています。 1)HTMLの学習曲線はスムーズで簡単に開始できます。 2)基本タグをマスターして、Webページの作成を開始します。 3)柔軟性が高く、CSSおよびJavaScriptと組み合わせて使用​​できます。 4)豊富な学習リソースと最新のツールは、学習プロセスをサポートしています。

HTML、CSS、およびJavaScriptの役割:コアの責任 HTML、CSS、およびJavaScriptの役割:コアの責任 Apr 08, 2025 pm 07:05 PM

HTMLはWeb構造を定義し、CSSはスタイルとレイアウトを担当し、JavaScriptは動的な相互作用を提供します。 3人はWeb開発で職務を遂行し、共同でカラフルなWebサイトを構築します。

HTML、CSS、およびJavaScriptの理解:初心者向けガイド HTML、CSS、およびJavaScriptの理解:初心者向けガイド Apr 12, 2025 am 12:02 AM

webdevelopmentReliesOnhtml、css、andjavascript:1)htmlStructuresContent、2)cssStylesit、および3)Javascriptaddsinteractivity、形成、

HTMLでの開始タグの例は何ですか? HTMLでの開始タグの例は何ですか? Apr 06, 2025 am 12:04 AM

Anexampleapalofastartingtaginhtmlis、それはaperginsaparagraph.startingtagsaresentionentientiontheyinitiateelements、definetheirtypes、およびarecrucialforurturingwebpagesandcontingthomedomを構築します。

Giteeページ静的なWebサイトの展開に失敗しました:単一のファイル404エラーをトラブルシューティングと解決する方法 Giteeページ静的なWebサイトの展開に失敗しました:単一のファイル404エラーをトラブルシューティングと解決する方法 Apr 04, 2025 pm 11:54 PM

GiteEpages静的Webサイトの展開が失敗しました:404エラーのトラブルシューティングと解像度Giteeを使用する

CSS3とJavaScriptを使用して、クリック後に周囲の写真を散乱および拡大する効果を実現する方法は? CSS3とJavaScriptを使用して、クリック後に周囲の写真を散乱および拡大する効果を実現する方法は? Apr 05, 2025 am 06:15 AM

画像をクリックした後、散乱と周囲の画像を拡大する効果を実現するには、多くのWebデザインがインタラクティブな効果を実現する必要があります。特定の画像をクリックして周囲を作成してください...

WebアノテーションにY軸位置の適応レイアウトを実装する方法は? WebアノテーションにY軸位置の適応レイアウトを実装する方法は? Apr 04, 2025 pm 11:30 PM

Y軸位置Webアノテーション機能の適応アルゴリズムこの記事では、単語文書と同様の注釈関数、特に注釈間の間隔を扱う方法を実装する方法を探ります...

HTML、CSS、およびJavaScript:Web開発者に不可欠なツール HTML、CSS、およびJavaScript:Web開発者に不可欠なツール Apr 09, 2025 am 12:12 AM

HTML、CSS、およびJavaScriptは、Web開発の3つの柱です。 1。HTMLは、Webページ構造を定義し、などなどのタグを使用します。2。CSSは、色、フォントサイズなどのセレクターと属性を使用してWebページスタイルを制御します。

See all articles