Project 02 Creating and Editing a Web Page

HTMLComprehensive Concepts and Techniques

Third Edition

Project 2

Creating and Editing a Web Page

HTML Project 2: Creating and Editing a Web Page 2

Project Objectives

• Identify elements of a Web page

• Start Notepad and describe the Notepad window

• Enable word wrap in Notepad

• Enter the HTML tags

• Enter headings and a paragraph of text

Project Objectives

• Create an unordered, ordered, or definition list

• Save an HTML file

• Use a browser to view a Web page

• Activate Notepad

• Identify Web page image types and attributes

Project Objectives

• Add an image, change the background color of a Web page, center a heading, and add a horizontal rule

• View the HTML source code in a browser

• Print a Web page and an HTML file

• Quit Notepad and a browser

Starting Notepad

• Click the Start button on the Windows Taskbar

• Click All Programs on the Start menu

• Point to Accessories on the All Programs submenu and then point to Notepad on the Accessories submenu

• Click Notepad

Starting Notepad

Enabling Word Wrap in Notepad

• Click Format on the menu bar

• If the Word Wrap command does not have a check mark next to it, click Word Wrap

Enabling Word Wrap in Notepad

HTML Tags and Their Functions

Entering HTML Tags to Define the Web Page Structure• Type <!DOCTYPE html and then press the ENTER key• Press the SPACEBAR three times, type PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" as the entry, and then press the ENTER key

• Press the SPACEBAR three times, type "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> as the entry, and then press the ENTER key twice

• Type <html> and then press the ENTER key• Type <head> and then press the ENTER key

Entering HTML Tags to Define the Web Page Structure• Type <title>Campus Tutoring Service Home Page</title> and then press the ENTER key

• Type </head> and then press the ENTER key• Type <body> and then press the ENTER key twice• Type </body> and then press the ENTER key• Type </html> as the end tag

Entering HTML Tags to Define the Web Page Structure

Entering a Heading

• Click the blank line below the <body> tag, type <h1>We'll be open soon!</h1> in the text area, and then press the ENTER key twice

Entering a Heading

Entering a Paragraph of Text

• With the insertion point on line 12, press the ENTER key and then type <p>The Campus Tutoring Service will be open for business soon! Dr. Isabel Myers, Dean of Student Services, announced Monday that the university has several new services to help students succeed. Part of that effort includes the newest addition to Student Services, the Campus Tutoring Service. The university wants to make sure that all students can be successful, especially in their first year on campus. We have student tutors available for several freshman-level classes.</p> and then press the ENTER key

• With the insertion point on line 19, type <p>Call 1-219-555-2510 for an appointment, or visit us in the Anderson building, room 360.</p> and then press the ENTER key twice

Creating an Unordered List

• With the insertion point on line 20, press the ENTER key, type <h2>Our services include tutors for the following courses:</h2> as the entry, and then press the ENTER key

• Type <ul> as the start tag and then press the ENTER key

• Type <li>Math 141</li> and then press the ENTER key

• Type <li>Accounting 200</li> and then press the ENTER key

• Type <li>Economics 251</li> and then press the ENTER key

• Type </ul> as the end tag and then press the ENTER key

Saving an HTML File

• With a floppy disk in drive A, click File on the menu bar

• Click Save As on the File menu

• Type project2.htm in the File name text box

• Click the Save in box arrow

Saving an HTML File

• Click 3½ Floppy (A:) in the Save in list

• Click the Project02 folder and then double-click the ProjectFiles folder in the list of available folders

• Click the Save button in the Save As dialog box

Saving an HTML File

Starting a Browser

• Click the Start button on the Windows taskbar and then point to All Programs on the Start menu

• Click Internet Explorer (or another browser command) on the All Programs submenu. If necessary, click the Maximize button to maximize the browser window

Starting a Browser

Viewing a Web Page in a Browser

• When the browser window appears, click the Address bar

• Type a:\Project02\ProjectFiles\project2.htm in the Address box

• Press the ENTER key

Viewing a Web Page in a Browser

Activating Notepad

• Click the Notepad button on the taskbar

Adding an Image

• Click after the > symbol on line 10 and then press the ENTER key

• Type <img src="cts_clip8.gif“ width="484“ height="62“ alt="Student Services logo" /> as the tag

Adding an Image

Adding a Background Color

• Click after the y in <body> on line 10 and then press the SPACEBAR

• Type bgcolor=“#fffbc6” as the color code

Adding a Background Color

Centering a Heading

• Click line 12 just after the 1 in the <h1> tag and then press the SPACEBAR

• Type align=“center” as the attribute

Centering a Heading

Adding a Horizontal Rule

• Click line 11 just after the > symbol in the <img> tag and then press the ENTER key

• Type <hr /> as the HTML tag

• Click File on the menu bar and then click Save

Adding a Horizontal Rule

Refreshing the View in a Browser

• Click the Campus Tutoring Service Home Page button on the taskbar

• Click the Refresh button on the Standard toolbar

Refreshing the View in a Browser

Viewing HTML Source Code for a Web Page• Click View on the menu bar

• Click Source on the View menu

• Click the Close button on the Notepad title bar

Viewing HTML Source Code for a Web Page

Printing a Web Page and an HTML File• Ready the printer according to the printer

instructions

• With the project2.htm Web page open in the browser window, click File on the menu bar and then click Print on the File menu

• Click the OK button in the Print dialog box

Printing a Web Page and an HTML File• With the printer stops printing the Web

page, retrieve the printout

• Click the Notepad button on the taskbar to activate the Notepad window

• Click File on the menu bar and then click Print on the File menu

Printing a Web Page and an HTML File

Quitting Notepad and a Browser

• Click the Close button on the Notepad title bar

• Click the Close button on the Campus Tutoring Service Home Page title bar

Project Summary

• Identify elements of a Web page

• Start Notepad and describe the Notepad window

• Enable word wrap in Notepad

• Enter the HTML tags

• Enter headings and a paragraph of text

Project Summary

• Create an unordered, ordered, or definition list

• Save an HTML file

• Use a browser to view a Web page

• Activate Notepad

• Identify Web page image types and attributes

Project Summary

• Add an image, change the background color of a Web page, center a heading, and add a horizontal rule

• View the HTML source code in a browser

• Print a Web page and an HTML file

• Quit Notepad and a browser

HTMLComprehensive Concepts and Techniques

Third Edition

Project 2 Complete

Project 02 Creating and Editing a Web Page

Education

Creating Music & Editing Audio Tutorial

HTML PROJECT #2 Project 2 Creating and Editing A Web Page

Creating and Editing Vector data - Texas A&M Universityceprofs.tamu.edu/folivera/GIS-CE/ArcGISMaterials... · c. Creating a line shapefile, adding features and editing lines d. Creating

Creating And Editing St. Marks Wiki Pages

Text before copy-editing for: ―Creating Authority ‖ Craig ...faculty.utep.edu/Portals/1858/Castaneda Authority Remittances.pdf · Text before copy-editing for: ―Creating Authority.‖

Project Proposal Claire Powers. Project: I will be creating and editing a series of books for Tarheel Reader

Creating and Editing PLS Model

1 Microsoft Publisher Project 1 Creating and Editing a

HTML Comprehensive Concepts and Techniques Third Edition 2 nd Project Creating and Editing a Web Page

Creating and Editing a Web Page - Valencia High …...2007/09/10 · HTML Project 2: 4 Creating and Editing a Web Page Project Objectives 11.Add an image, change the background color

HTML Concepts and Techniques Fourth Edition Project 2 Creating and Editing a Web Page

Creating and Editing Centerline Geometry 2021R1-04-01

Creating and Editing a Web Page Project 2. Project Objectives Project 2: Creating and Editing a Web Page 2 Identify elements of a Web page Start Notepad

CREATING & EDITING DATA - christinafriedle.com · CREATING & EDITING DATA ... Topology & ArcGIS Depends on the data structure ... 1. Set editing environment (i.e. snapping) 2. Select

Creating and Editing Feature Data

Creating and editing a presentation with clipart

Create Multipatch Features and Texture Editing · Creating multipatch features and texture editing . 13. Save the project. Add trees with preset configurations 1. On the Map tab,

Google sites creating editing and sharing a site

3 CREATING AND EDITING SHAPESteachers.dadeschools.net › aalvarez2 › Lessons › Lesson3 › lesson3.pdf · LESSON 3 Creating and Editing Shapes 4 Click the Document Setup button

Creating and Editing Geodatabase Features