You have added a line break inside the text. Let's add some formatted text next." />
</Exercise>
<Exercise
task="Add opening and closing !_b_! tags at the blue arrow to define bold text."
level="3" >
<SourceCode>
<![CDATA[
<!DOCTYPE html>
<html>
<body>

<h1>My Website</h1>

<p>
Some text.<br>
Some more text.<br>
$code_hint$
</p>

</body>
</html>
]]>
</SourceCode>
<CodeHint />
<ExpectedCode
fail="Add the code !_&lt;b&gt;&lt;/b&gt;_! at the blue arrow.">
<![CDATA[<b></b>]]>
</ExpectedCode>
</Exercise>
<Exercise
task="Add the text '_Some bold text._' between the !_b_! tags."
level="3" >
<SourceCode>
<![CDATA[
<!DOCTYPE html>
<html>
<body>

<h1>My Website</h1>

<p>
Some text.<br>
Some more text.<br>
<b>$code_hint$</b>
</p>

</body>
</html>
]]>
</SourceCode>
<CodeHint />
<ExpectedCode
fail="Add the code !_&lt;b&gt;Some bold text.&lt;/b&gt;_! at the blue arrow.">
<![CDATA[<b>Some bold text.</b>]]>
</ExpectedCode>
<Run success="Great! The !_b_! tag is used to define bold text." />
</Exercise>
<Exercise
task="Now use an !_i_! tag to add the italic text '_Some italic text._'."
level="4" >
<SourceCode>
<![CDATA[
<!DOCTYPE html>
<html>
<body>

<h1>My Website</h1>

<p>
Some text.<br>
Some more text.<br>
<b>Some bold text.</b><br>
$code_hint$
</p>

</body>
</html>
]]>
</SourceCode>
<CodeHint />
<ExpectedCode
fail="Add the code !_&lt;i&gt;Some italic text.&lt;/i&gt;_! at the blue arrow.">
<![CDATA[<i>Some italic text.</i>]]>
</ExpectedCode>
<Run success="Awesome job!" />
</Exercise>
<Exercise
task="Congratulations, you've learned basic text formatting with HTML in this lesson! Now play with the code a bit on your own. Change the text which is shown and run it as often as you like. Then continue with the next lesson." >
</Exercise>
</Lesson>





<Lesson
title="Images"
example="&lt;img src=&quot;myimage.png&quot;&gt;"
description="In this lesson you'll learn to include images in your web pages.">

<Files
template="simple_project"
template2="simple_project_images"
project_name="My Website">
<CodeFile name="index.html" />
</Files>

<Exercise
task="Press Run to view the website below. It contains an image."
level="1" >
<SourceCode>
<![CDATA[
<!DOCTYPE html>
<html>
<body>

<h1>My Website</h1>

<img$code_hint$ src="img/android.jpg$code_hint_1$">
$code_hint_2$

</body>
</html>
]]>
</SourceCode>
<Run success="Great! Let's learn how images work in HTML." />
</Exercise>
<Exercise
task="The !_img_! tag is used to include an image."
level="1" >
<CodeHint />
</Exercise>
<Exercise
task="The !_src_! attribute defines the image. Here the file !_img/android.jpg_! of this website project is used."
level="1" >
<CodeHint_1 />
</Exercise>
<Exercise
task="Add a second image with the file !_img/html.jpg_!."
level="4" >
<CodeHint_2 />
<ExpectedCode
fail="Add the code !_&lt;img src=&quot;img/html.jpg&quot;&gt;_!.">
<![CDATA[<img src="img/html.jpg">]]>
</ExpectedCode>
<Run success="Great!" />
</Exercise>
<Exercise
task="Congratulations, you've learned to include images in this lesson! Now play with the code a bit on your own. Change the text which is shown and run it as often as you like. Then continue with the next lesson." >
</Exercise>
</Lesson>




<Lesson
title="Links"
example="&lt;a href=&quot;www.google.com&quot;&gt;...&lt;/a&gt;"
description="In this lesson you'll learn to include hyperlinks in your web pages.">

<Files
template="simple_project"
template2="simple_project_images"
project_name="My Website">
<CodeFile name="index.html" />
</Files>

<Exercise
task="Press Run to view the website below. It contains a hyperlink that you can click on to open another web page."
level="1" >
<SourceCode>
<![CDATA[
<!DOCTYPE html>
<html>
<body>

<h1>My Website</h1>

<a$code_hint$ href="http://www.google.com$code_hint_1$">Google$code_hint_2$</a>
$code_hint_3$

</body>
</html>
]]>
</SourceCode>
<Run success="Great! Click on the '_Google_' link in this web page. Let's learn how links work in HTML." />
</Exercise>
<Exercise
task="A hyperlink is defined with the !_a_! tag in HTML."
level="1" >
<CodeHint />
</Exercise>
<Exercise
task="The !_href_! attribute of the !_a_! tag specifies the destination web page of the link. Here it is '_http://www.google.com_'."
level="1" >
<CodeHint_1 />
</Exercise>
<Exercise
task="The text between the opening and closing !_a_! tags is shown in the web page."
level="1" >
<CodeHint_2 />
</Exercise>
<Exercise
task="Add a second link to '_http://www.android.com_' with the the text '_Android_'."
level="4" >
<CodeHint_3 />
<ExpectedCode
fail="Add the link with the !_a_! tag !_&lt;a href=&quot;http://www.android.com&quot;&gt;&lt;/a&gt;_!.">
<![CDATA[<a href="http://www.android.com">]]>
</ExpectedCode>
<ExpectedCode
fail="Add the text '_Android_' between the opening and closing !_a_! tags.">
<![CDATA[<a href="http://www.android.com">Android</a>]]>
</ExpectedCode>
<Run success="Awesome! Test your newly added hyperlink." />
</Exercise>
<Exercise
task="To use an image as a link add an image with the file !

Prev | Next
Pg.: 1 2 3 4 5 6 7 8


Back to home | File page

Subscribe | Register | Login | N