neocities/views/tutorial/html/3.erb

35 lines
1.3 KiB
Text

<div class="comic" style="height: 500px; background-image: url(/img/tutorial/ch1pg3.png); background-size: 483px;">
<div class="dialogue" style="left: 50px; top: 30px;">
Great work! Let's move on to writing your first tag.
<!-- Check out your site at <a href="">victoria.neocities.org</a>. -->
</div>
<div class="dialogue" style="left: 300px; top: 25px; width: 250px">
Let's make your name a heading by putting the <strong>h1 tag</strong> around it. This helps to visually separate content on your site.
</div>
<div class="dialogue" style="left: 330px; top: 120px; width: 250px">
Try using an h1 tag by changing the text to something like this:<strong><span id="answer"></span></strong>
and click save.
</div>
</div>
<div class="welcome">
<h4>Heading Tags</h4>
<p>Here are all the heading tags, for all your needs—from the most important to the least!</p>
<pre><code class="html"><%= erb :'tutorial/html/code_examples/3', layout: false %></code></pre>
</div>
<script>
$('#answer').text('<h1>'+sessionStorage.getItem('name')+'\'s Web Site</h1>')
function checkHomework() {
var html = editor.getValue()
if(!html.match(/<h1>\S.+<\/h1>/)) {
notok("That doesn't look like a header! Try again.")
} else {
sessionStorage.setItem('tutorialHtml', html)
ok('Nice header!', '/tutorial/html/4')
}
}
</script>