Debugging exercise. Debugging exercise A few problems? <figure> <img src="images/riley.jpg" alt=Riley is a 5 year old Shepard /> <ficaption><a href="sm-funny.jpg">funny.jpg</a></figure>

Slides:



Advertisements
Similar presentations
TABLES 6 How to create tables What information suits tables How to represent complex data in tables.
Advertisements

An in-class debugging exercise. All based upon real errors.
Introduction to HTML Lists, Images, and Links. Before We Begin Save another file in Notepad Save another file in Notepad Open your HTML, then do File>Save.
P449. p450 Figure 15-1 p451 Figure 15-2 p453 Figure 15-2a p453.
 2008 Pearson Education, Inc. All rights reserved. 1 Introduction to HTML.
Introduction to HTML II Shih-Heng Chin. Preface Structure of a HTML File Elements used frequently Tables.
Basic HTML All About Me - Your Name Information for display.
Phil Campbell (LSBU) Session 2 Other Common Tags IMG Finding images Tables Anchor Tags Web layouts Tables Exercise Summary of attributes.
Figure Figure 18-1 part 1 Figure 18-1 part 2.
HTML Lesson 5 TBE 540. Prerequisites The user must be able to… –Create basic web pages with a text editor and/or a web page editor.
Tags through Forms. This element is required for all HTML pages It must be at the top of every page of every website We’ll see later on why it is important.
Images and Tables. Displaying Image Attributes: SRC= " mypic.gif " – Name of the picture file SRC= " pic/mygif.jpg " – Name of file found in pic directory.
An in-class debugging exercise.. Alex B Cook Alex Having a dog can be a very rewarding experience. However, there are a few challenges that any canine.
Internet & World Wide Web How to Program, 5/e Copyright © Pearson, Inc All Rights Reserved.
Cascading Style Sheet Basics Pepper. Looking at the HTML See the surrounding tags See head, body, paragraph, header See the ending tags See the list.
Creating your Webpage with tables. This is a 2 column by 1 row table!
Should have seen something like this last week What does do? stands for table row and starts a new row in the table.
CSS Sprites. What are sprites? In the early days of video games, memory for graphics was very low. So to make things load quickly and make graphics look.
HTML Overview Part 4 – Tables 1. HTML Tables  Tables are defined with the tag pair.  A table is divided into rows with tag pairs. o tr stands for "table.
Getting Started with HTML Please use speaker notes for additional information!
CS105 INTRODUCTION TO COMPUTER CONCEPTS HTML Instructor: Cuong (Charlie) Pham.
CREATING WEB PAGES Using…More HTML code! My First \ Web Page.
4 Chapter Four Introduction to HTML. 4 Chapter Objectives Learn basic HTML commands Discover how to display graphic image objects in Web pages Create.
HTML— More Tags, Formatting, and Lists. Formatting Tags  Bold  Italics  Underline  Big text  Small text  Subscript (H 2 O)  Superscript (10 3 )
HTML ( HYPER TEXT MARK UP LANGUAGE ). What is HTML HTML describes the content and format of web pages using tags. Ex. Title Tag: A title It’s the job.
Type your question here. Type Answer Type your question here. Type Answer.
Week 2: Building a Simple Website IMC 320 Web Publishing Spring 2011.
Introduction to HTML UWWD. Agenda What do you need? What do you need? What are HTML, CSS, and tags? What are HTML, CSS, and tags? html, head, and body.
Mr. Rouda’s CSCI 101 sections. Web Expression Tutorial New Folder Code View New File.
HTML CS 105. Page Structure HTML elements control the details of how a page gets displayed. Every HTML document has the following basic structure: … …
CONTROLLING Page layout
Assignment 3 Your going to modify your last Best Movies page and Recipe page Your going to modify your last Best Movies page and Recipe page You will need.
This shows CIS17 and the first day introduction..
Chapter 4 HTML Tags. HTML is written in something called tags. Tags come in pairs, an opening one and a closing one. The first pair of tags we'll write.
Revision Webpage design HTML.   FACE  Attributes  Marquee  Define the following terms.
HTML Help book. HTML HTML is the programming language used to make web pages for the Internet. HTML stands for Hyper Text Markup Language. HTML is made.
HTML.
Creating and Linking Web Pages
© 2016 Pearson Education, Inc., Hoboken, NJ. All rights reserved.
Web Development Part 1.
What is HTML? Acronym for: HyperText Markup Language
Organizing Content with Lists and Tables
Semester - Review.
Survey of Computer Science CSCI 110, Spring 2011 Lecture 23 HTML
Elements of HTML Web Design – Sec 3-2
Elements of HTML Web Design – Sec 3-2
Intro to HTML Mr. Singh.
Programming the Web using XHTML and JavaScript
Elements of HTML Web Design – Sec 3-2
Introduction to HTML.
<TAG> <html> <head>
H T M L A B E S X P I N D.
Cat Scratchers - dnclifestyle.com.au
Essentials of HTML.
Mr. Rouda’s CSCI 101 sections
Essentials of Web Pages
Essentials of HTML.
If You Know Nothing About HTML, This is Where You Start.
Introduction to XHTML Cont:.
Unit 2 Test Building a Web Page Test.

HTML Tables.
Hyperlinks 1 2.
Introduction to HTML.
Single Tags <tagName> Example: <BR>
Computer communications
Contents: 1. More on tables 2. Images (the <img> tag)
Headlines here in upper and lower case
Headlines here in upper and lower case
Headlines here in upper and lower case
Presentation transcript:

Debugging exercise

A few problems? <figure> <img src="images/riley.jpg" alt=Riley is a 5 year old Shepard /> <ficaption><a href="sm-funny.jpg">funny.jpg</a></figure> <figcaption/> The image files riley.jpg funny.jpg and sm-funny.jpg are in the same folder as the page with this code.

Answer: <figure> <img src="images/riley.jpg" alt=Riley is a 5 year old Shepard /> <ficaption><a href="sm-funny.jpg">funny.jpg</a></figure> <figcaption/> <figure> <img src="riley.jpg" alt="Riley is a 5 years old" />  removed images <figcaption><a href="funny.jpg"><img src=“sm-funny.jpg”> </a></figcaption> figcaption tags should be inside figure tags </figure>

Why is my bulleted list not working? <bl> <li>American Bobtail<li> <li>Burmese</li> <l1>Egyptian Mau <li>Manx <liSiamese</li> <li>Sphynx<li/> </bl>

Answer: Before After <bl> <li>American Bobtail<li> <li>Burmese</li> <l1>Egyptian Mau <li>Manx <liSiamese</li> <li>Sphynx<li/> </bl> <ul> <li>American Bobtail</li> <li>Burmese</li> <li>Egyptian Mau</li> <li>Manx</li> <li>Siamese</li> <li>Sphynx</li> </ul> End li tags are not required

What is wrong here? <table> <td>The penalty for killing a cat, 4,000 years ago in Egypt, was death. <td>95% of cat guardians admit they talk to their cats. <td>A cat can be either right-pawed or left-pawed. </tr> <td>A cat can jump as much as seven times its height. <td>A cat has 230 bones in its body. A human only has 206 bones. <td>A cat has four rows of whiskers. <tr colspan="2">Source: http://www.pets90210.org/trivia.asp</tr> </table>

Answer: <table> <tr> <td>The penalty for killing a cat, 4,000 years ago in Egypt, was death.</td> <td>95% of cat guardians admit they talk to their cats.</td> <td>A cat can be either right-pawed or left-pawed.</td> </tr><tr> <td>A cat can jump as much as seven times its height.</td> <td>A cat has 230 bones in its body. A human only has 206 bones.</td> <td>A cat has four rows of whiskers.</td> <td colspan=“3">Source: http://www.pets90210.org/trivia.asp</td> </tr> </table>