Home > Web Front-end > HTML Tutorial > Novice self-study website building HTML Lesson 3 Making my first web page_html/css_WEB-ITnose

Novice self-study website building HTML Lesson 3 Making my first web page_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:07:33
Original
1673 people have browsed it

In the last lesson, we learned about the working interface of Dreamweaver. Starting from this lesson, we start to learn the production of web pages from the shallower to the deeper.

First open Dreamweaver. To create a web page, you must first create a new document, just like we need a piece of paper to write a manuscript.

Only with a carrier can you create on it, so the first knowledge point you want to learn today: several methods of creating and saving documents.

Let’s start with the three methods of creating a new document:

The picture lists three methods of creating a new document,

New: shortcut key ( Ctrl N).

Let’s talk about several methods of saving documents:

Save: shortcut key (Ctrl S)

Save as: shortcut Key (Ctrl Shift S)

A good habit for making web pages: save the document at any time to prevent the loss of document content caused by unexpected factors (such as breakpoints, crashes, etc.).

The second knowledge point: making my first web page.

Take my first blog post (a must-read for website beginners) as an example and make it into a web page.

Blog post address:

There are more than 1,000 words, how do you put it into a web page?

The first thing I think of is: 1. Manual input. It’s just 1,000 words, no big deal.

OK, 5 minutes, done.

But in the blink of an eye, if one day at work, your boss asks you to turn a document with tens of thousands of words into a web page in 5 minutes. Then this method is absolutely impossible.

So I thought of the import function that I saw when I was getting familiar with various menus in the previous class. Can I import a document directly into a web page?

2. Import the word document to the web page.

First create a new word document.

Copy the blog post into a word document.

Click the Dreamweaver file menu?Import?word document.

A few seconds and done.

Is there any other way? Can I just copy and paste it? Give it a try!

Select the content of the blog post and right-click to copy.

Click the Edit menu to paste.

OK, it can be done as well.

Let’s observe its code:

It is found that each paragraph is composed of

XXXXXX

, this

< /p>What does it mean?

Open w3school, click on the html element, we can see this explanation:

Element:

This is my first paragraph.

The

element defines a paragraph in the HTML document.

This element has a start tag

, and an end tag

.

The content of the

element is: This is my first paragraph.

It seems that

is a paragraph symbol. There is a Chinese word called "beginning and ending", so when we write a web page, don't forget to write the closing tag

.

Good habits for making web pages: tags must be written in pairs: (such as

, )

When making web pages Good habit: Always use lowercase letters for labels.

Give our webpage a name:

1. In the document toolbar, modify the webpage title in the title area.

2. Modify the page title at the code .

Save the document, name it myfirstweb, and save it under the web folder: (Readers can choose your own folder to save and name)

Note: The document name must be letters or numbers, do not underline it, and do not name it with Chinese characters.

Double-click to open myfirstweb.html

Our first web page is completed.

The first web page is completed.

(Additional: If the import word document button is gray, it should be caused by the word software not being installed.)

by??Midnight Cat

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template