2.9 Heading Practice

2.9 Heading Practice Hello World!Funky One-liner

2.9 Heading Practice

Hello World!

Instructions: Lets practice creating headings and then changing their font types.

Create a webpage with a heading "Hello World!"

Bold the text

Add another heading that is smaller than the previous heading

Italicize the other heading

Make sure your code is formatted correctly

Template


1. Create a webpage with a heading "Hello World"

2. Bold the text

3. Add another heading that is smaller than the previous heading

4. Italizcize the other heading

5. Make sure your code is formatted correctly


ANSWERS:



<!DOCTYPE html>
<html>
	<head>
	</head>
	<body>
		<h1><b>Hello World</b></h1>
		<h2><i>This is another heading</i></h2>
	</body>
</html>

Funky One-liner

Instructions: Now create a funky one-liner.

Create a webpage with a heading, "This is a funky one-liner".

Underneath that, write a different heading, "No. This is a funky one-liner".

Change "funky one-liner" to a smaller heading on the first heading.

Randomly change individual/groups of letters in different heading sizes on the second heading.

Template


<!--
    Funky One Liner
    1. Create a webpage with a heading, "This is a funky one-liner"
    2. Underneath that, write a different heading, "No. This is a funky one-liner"
    3a. Change "funky one-liner" to a smaller heading on the first heading
    3b. Randomly change individual/groups of letters in different heading sizes on the second heading
-->

<!DOCTYPE html>
<html>
    <head>
        <title>Funky One-Liner Practice</title>
    </head>
    <body>
        <!----Insert Code Here--->
    </body>
</html>

Solution


<!DOCTYPE html>
<html>
    <head>
        <title>Funky One-Liner Practice</title>
    </head>
    <body>
        <h1>This is a </h1><h2>funky one-liner<h2>
        <h1>NO.</h1><p>Th<p><h5>is is a <h5><h3>Fun</h3>ky one-<h2>liner<h2>
        <p>Now they're no longer one-liners.</p>
    </body>
</html>

Previous Section

8️⃣

2.8 HTML Text Formatting

Next Section

🔟

2.10 About Me Practice

⚖️

Copyright © 2021 Code 4 Tomorrow. All rights reserved. The code in this course is licensed under the MIT License. If you would like to use content from any of our courses, you must obtain our explicit written permission and provide credit. Please contact classes@code4tomorrow.org for inquiries.