The dirty dozen. An in-class debugging exercise.
Dec 24, 2015
The dirty dozen.
An in-class debugging exercise.
1. What is missing?<!DOCTYPE html>
<HTML>
<meta charset="utf-8"/>
<Title>Alex B Cook</Title>
<h1>Alex</h1>
<p>Having a dog can be a very rewarding experience. However, there are a few challenges that any canine owner should be aware.</p>
<h3>Identification</h3>
<p>Your dog should wear a collar at all times. </p?
:
:
1. Answer : Structure tags<!DOCTYPE html>
<HTML>
<meta charset="utf-8"/>
<head>
<Title>Alex B Cook</Title>
</head>
<body>
<h1>Alex</h1>
<p>Having a dog can be a very rewarding experience. However, there are a few challenges that any canine owner should be aware.</p>
<h3>Identification</h3>
<p>Your dog should wear a collar at all times.</p>
:
:
2. 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>
2. Answer:Before After
<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
<bl>
<li>American Bobtail<li>
<li>Burmese</li>
<l1>Egyptian Mau
<li>Manx
<liSiamese</li>
<li>Sphynx<li/>
</bl>
3. Why does my class not work?<h3>Visit the Vet</h3>
Your dog should be checked with a local veterinarian. <span class bigbold>He should be fully vaccinated.</class> Booster vaccination will be required yearly. It is especially important that your dog is neutered before he comes in contact with other dogs. Neutering will prevent many of the dogs more anti-social habits.
<h3>The First Day Home</h3>
It is best to keep him on a leash.
:
:
3. Answer : <h3>Visit the Vet</h3>
Your dog should be checked with a local veterinarian. <span class=“bigbold”>He should be fully vaccinated.</span> Booster vaccination will be required yearly. It is especially important that your dog is neutered before he comes in contact with other dogs. Neutering will prevent many of the dogs more anti-social habits.
<h3>The First Day Home</h3>
It is best to keep him on a leash.
:
:
4. What is the one little error?<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" media="screen" href="project5.txt" />
<title>Alex B Cook</title>
</head>
4. Answer:<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" media="screen" href="project5.css" />
<title>Alex B Cook</title>
</head>
5. A few problems?<img src="images/riley.jpg" alt=Riley is a 5 year old Shepard />
<ficaption><a href="sm-funny.jpg">funny.jpg</a><figcaption/>
The image files riley.jpg funny.jpg and sm-funny.jpg are in the same folder as the page with this code.
5. Answer:
<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>
When you click on the thumbnail it should show the bigger image.
<img src="images/riley.jpg" alt=Riley is a 5 years old />
<ficaption><a href="sm-funny.jpg">funny.jpg</a><figcaption/>
The image files riley.jpg funny.jpg and sm-funny.jpg are in the same folder as the page with this code.
6. 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>
<tr colspan="2">Source: http://www.pets90210.org/trivia.asp</tr>
</table>
6. 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>
</tr><tr>
<td colspan=“3">Source: http://www.pets90210.org/trivia.asp</td></tr>
</table>
7. Why does mainnav not show skyblue and why does my class info not work?td {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px; }
h1, h2, h3, h4, p {
font-family: Verdana, Arial, Helvetica, sans-serif; }
#mainnav {
background: skyblue:
text-align: center;
margin: 0;
padding: 0.25em; }
#info {
background-color: #8BB381; }
7. Answer: Why does mainnav not show skyblue and why does my class info not work?td {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px; }
h1, h2, h3, h4, p {
font-family: Verdana, Arial, Helvetica, sans-serif; }
#mainnav {
background: skyblue; change colon to semicolon
text-align: center;
margin: 0;
padding: 0.25em; }
.info { a class should have a period before its name
background-color: #8BB381; }
8. Eight style errors.<!– styles for project 17 -->#contact { width: 12.5; margin;}.slant font-weight: italic; link { color: #42210;}visited { color: white;}
8. Answer:
<!– styles for project 17 -->#contact { width: 12.5; margin;}.slant font-weight: italic; link { color: #42210;}visited { color: white;}
<!– styles for project 17 --> #contact { width: 12.5em; margin: 0; <-- missing value}.slant { font-style: italic; }a:link color: #422100; Colors need 6 digits}a:visited { color: white;}
invalid html comment
9. My links do not work. <p id="mainnav">
|<a href="project3/project3.html">Project 3</a> |
<a href="../../project4/project4.html" target=blank>Project 4</a> |
<a href="web.gccaz.edu/~abc1234567/lesson5/unit/index-sb.html">Unit E</a> |
<a href="http://www.azrescue.org" target="_blank">Dog Rescue |
<a href="who">Bottom of Page</a>
</p>
9. Answer. <p id="mainnav">
|<a href="project3/project3.html">Project 3</a> |
<a href="../../project4/project4.html" target=blank>Project 4</a> |
<a href="web.gccaz.edu/~abc1234567/lesson5/unit/index-abc.html">Unit E</a> |
<a href="http://www.azrescue.org" target="_blank">Dog Rescue |
<a href="who">Bottom of Page</a>
</p>
<p id="mainnav">
|<a href="../../project3/project3.html">Project 3</a> |
<a href="../../project4/project4.html" target=“_blank”>Project 4</a> |
<a href=“http://web.gccaz.edu/~abc1234567/lesson5/unit/index-abc.html">Unit E</a> |
<a href="http://www.azrescue.org" target="_blank">Dog Rescue</a> |
<a href=“#who">Bottom of Page</a>
</p>
10. What is incorrect? :
<h3>Be Consistent </h3>
<p>Your new dog must learn a whole set of new rules. Be patient and be consistent. If you want him off the furniture, don't allow him to sit on the couch "sometimes". Don't allow him to do something one time and forbid it another.</p>
<br />
</body>
</html>
<p>Your name: Alex b Cook
<br />
Your section number: HTML5,CSS3 Unit Z Project 0</p>
10. Answer: End body and html tags :
<h3>Be Consistent </h3>
<p>Your new dog must learn a whole set of new rules. Be patient and be consistent. If you want him off the furniture, don't allow him to sit on the couch "sometimes". Don't allow him to do something one time and forbid it another.</p>
<br />
<p>Your name: Alex b Cook
<br />
Your section number: HTML5,CSS3 Unit Z Project 0</p>
</body>
</html>
11. Can you find 9 errors? Style sheet for TASK
h2 h3 {
text-align: center;
h4 { text-align: right }
#resp {
margin left: auto;
margin-right; auto;
border style: solid;
border width: 0.1em;
padding: 1;
}
11. Answers:/* Style sheet for TASK */
h2, h3 {
text-align: center;
}
h4 { text-align: right; }
#resp {
margin-left: auto;
margin-right; auto;
border-style: solid;
border-width: 0.1em;
padding: 1em;
}
Missing comment tags
Missing comma
Missing }
Missing ;
Missing –
; should be a :
Missing -
Missing –
Missing em
12. What is incorrect?<!DOCTYPE html>
<HTML>
<head>
<meta charset="utf-8"/>
<Title>Alex B Cook</Title>
<h1>Alex</h1>
</head>
<body>
<p>Having a dog can be a very rewarding experience. However, there are a few challenges that any canine owner should be aware.</p>
<h3>Identification</h3>
:
12. Answer: Tags belong in body <!DOCTYPE html>
<HTML>
<head>
<meta charset="utf-8"/>
<Title>Alex B Cook</Title>
</head>
<body>
<h1>Alex</h1>
<p>Having a dog can be a very rewarding experience. However, there are a few challenges that any canine owner should be aware.</p>
<h3>Identification</h3>
: