Unformatted text preview:

Chapter 2 - HTMLLesson 1 - Introduction to HTMLLesson 2 - HTML Basics• PP presentation BasicHTML.ppt.• Lab 2.1.• Discuss HW 2.1. Use a text word processor. Include the basic required set of HTML tags! Submission.Lesson 3 - Links• HTML documents contain hypertext links. Explain and demonstrate what these are.• anchor - the text or image used to represent a link. The anchor tag is <A>.• An anchor uses a URL to specify the name and location of the linked document. Show how this is indicated by moving the mouse over an anchor and noting the link in the status bar.• attribute - a parameter which configures an HTML tag. Example: HREF is an attribute of the anchor tag <A>.• Example: Links.html.• Downloading images. Read. You will need to do this as you construct your Webpage. Say something about copyright issues.• There’s no in-class lab today. So start working on HW 2.2.Lesson 4 - Simple Tags, Attributes, and Comments• Lesson 4 contains a nice summary of the simple HTML tags, some of which we have seen before.• Example: Comments.html.• An HTML comment begins with <!-- and ends with -->.• Lab 2.2.• Start working on PR 2.1.Lesson 5 - Images and Image Maps• image map - an image that is divided into regions which can be programmed to respond in different ways.• Example: BodyParts.html. At this point, just demonstrate this example.• To understand how image maps work and how to create one, you have to know something about a computer screen.• pixel - short for picture element, a single point on a computer screen.• The monitors in G201/G204 contain 800 columns by 600 rows of pixels. The monitor on my laptop is 1280x854.• Describe the pixel coordinate system.• To create an image map, you use the <IMG>, <MAP>...</MAP>, and <AREA> tags.• The <IMG> tag contains a SRC attribute specifying the image and a USEMAP attribute specifying the name of the <MAP>...</MAP> tag pair containing the mapping coordinates.• <AREA> tags within the <MAP>...</MAP> tag pair identify the coordinates of the hot zones. The SHAPE attribute is used to specify the shape of a region; it can be a circle, a rectangle, or a polygon.• Example: BodyParts.html. This time, go through the source.• Reminder: Be sure to read the on-line discussion which contains another example.• Lab 2.3.Lesson 6 - Tables• Tables are handy for the following purposes: - Lining up material vertically and horizontally. - Making creative layouts. - Placing text next to graphics.• The tags and attributes used to create tables are given (in a table!) in Chapter 2, Lesson 6.• Example: Table.html. Make this Lab 2.4. Go through this example as follows: - Write the table on the board. - Start with the basic HTML skeleton code and add a title. - Insert <TABLE>...</TABLE> tags. - Type the text, row by row between the <TABLE>...</TABLE> tags, the way it is to appear. - Add <TR>...</TR> tags where the rows go. - Add <TH>...</TH> tags around the heading cells in the first row. - Add <TD>...</TD> tags around the remaining data cells. - Add the BORDER attribute to the <TABLE> tag with an appropriate number (BORDER=1, say) to put lines in the table. - Use the <CAPTION>...</CAPTION> tags for a title.• With all the tags needed for a table, it’s easy to get confused and make mistakes. You can often save yourself some trouble by using white space and blank lines to make your code easier to read.• Tables can be used to come up with creative layouts and page designs. Here are a few ideas: - Embed images in tables to align graphics and text the way you want. (See Lesson 6 for an example.) - Place text in table cells to make columns like a newspaper. - Place headings to the left or right of a paragraph of text.• Start working on HW


View Full Document

GETTYSBURG CS 103 - LECTURE NOTES

Documents in this Course
Load more
Download LECTURE NOTES
Our administrator received your request to download this document. We will send you the file to your email shortly.
Loading Unlocking...
Login

Join to view LECTURE NOTES and access 3M+ class-specific study document.

or
We will never post anything without your permission.
Don't have an account?
Sign Up

Join to view LECTURE NOTES 2 2 and access 3M+ class-specific study document.

or

By creating an account you agree to our Privacy Policy and Terms Of Use

Already a member?