Dreamweaver website construction Ultimate Tutorial

Source: Internet
Author: User
Tags dreamweaver dreamweaver website

1. Define a site

1. Create a folder under any root directory (we suppose it is an edisk), for example, named MyWeb.
*** NOTE: All files on the website must use English names.
2. Open Dreamweaver and select "site-create site" to open the dialog box. Enter the website name (Chinese available) in the site name, and select the created folder (E: web) in the local root folder ). Then, click OK.
* ** Note: When Dreamweaver is opened again, the website you just set up is automatically located. If you have multiple sites, you can choose "site-open site" from the menu.

2. Create a page

1. In the local folder E: folder. Htm indicates that the webpage file is a static HTML file. Rename the ingress as index.htm.
* ** The name of the first page of the website is usually index.htmor index.html. The names of other pages can be retrieved by yourself.
2、double-click index.htm to enter the editing status of the page. Enter the webpage name in the title space, right-click the page and choose Page properties to open the "page properties" window. Here, you can set the title, background color, or back image of the website, and the hyperlink color (generally by default). Keep the default values for others.
3. At this time, the cursor is in the upper left corner. You can enter a sentence, for example, "Welcome to my homepage ". Select text, open the property panel with "window/properties" in the menu, select the text size to 6, and center the text. Then, press enter several times before the text to place it in the middle of the page.
4. To select a font, select the last item in the font: Edit the font list. Select the plus sign in the dialog box, select a font to be added to the font list in the "available font" column, and click the button in the middle to add it.
* ** The most common web pages are in simplified Chinese characters. Do not add a special font to the list, because it cannot be seen on other computers. If you want to use it, make it into an image before using it.
* ** The method for entering spaces on a webpage is to adjust the input method to the full angle.
* ** The method for wrapping a line on a webpage is shift + Enter. Only press Enter to change the segment.

3. Add images to the page

1. In the local folder E: blank space under MyWeb, right-click and choose "New Folder". In this way, a folder is created and used to store images, you can change the name to either tu or pic or images.
2. Use the "window/object" menu to open the object panel, click "Insert image", and select the image to be inserted in the dialog box. If the dialog box appears: "Would you like to copy this file to the root folder ?", You must select "yes" and save it to the created folder.
3. Select the image and open the attribute panel. You can name the image on it, and reset the height and width of the image. You can drag the point on the image corner to resize it. Hold down the shift key, and then drag the point on the corner to make the image stretch at a high aspect ratio. To restore the original size, click Reset size in the lower right corner.
4. "link" can be entered here directly. "Alternative" is the description of the image, that is, the text displayed by the mouse pointing to the image; "border" is the width of the image border, and "alignment" is the alignment.

4. Add a hyperlink

1. Add links to text.
For example, enter "my article" on the page, select it, open the property panel, and select the page to be linked to in the "link" field. We usually use self as the new window to replace the current window, or select blank to open the new window.
2. Add links to images
Just like the link in the text above, insert an image and select the link in the property panel.
* ** You can create multiple links for images. The method is as follows:
There are some images under the "map" item in the attribute panel, such as clicking a square, turning the cursor into a cross, and drawing a heat area of a blue rectangle on the image, in this case, you can set the link address for this hot zone on the property panel. Similarly, you can set another link for the image by setting a heat area with a circle.
3. Add an email link
Select the text or image of the e-mail link to be added, open the properties panel, and enter the email address in the "link" field. The format is as follows: mailto: email address. Note that there is no space in the middle.
4. If you link to files that cannot be opened by the browser, such as exe and Zip files, the viewer can download the files or play the files online when clicking this link.

V. Use of tables

1. Click insert/table to open the table panel and set it. Number of rows, number of columns, width, and border. "cell padding" indicates the distance between the inside and the content of the cell. "cell spacing" indicates the distance between cells, in pixels.
2. After inserting a table, click on the border of the table to select the entire table. Then you can perform various settings in the attribute panel below.
3. Move the cursor to a cell. The attribute panel displayed here is the attribute panel of the cell. You can also perform various operations on cells. Such as background color, background image, border, merge, split, etc.

6. Other table operations

Principle of creating a thin-line table:
1. Select the entire table and set its background to black (the color of the table line ).
2. Select all cells and set the background to white.

II. Automatic table formatting
1. Create a table and select it.</

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.