neocities/views/tutorial/html/8.erb

48 lines
1.9 KiB
Text

<div class="comic" style="height: 530px; background-image: url(/img/tutorial/ch1pg8.png); background-size: 489px; margin-top:1em">
<div class="dialogue" style="top: 50px; left: 0; width: 380px">
Now add a link to one of your list items. If nested properly, it should look similar to this:
<br>
<div class="txt-Left">
<strong>&lt;li&gt;<br>&nbsp;&nbsp;&lt;a href="http://yarn.com"&gt;Yarn&lt;/a&gt;<br>&lt;/li&gt;</strong>
</div>
</div>
</div>
<div class="welcome">
<h4>Tags so far</h4>
<p>Headings: <pre><code class="html"><%= erb "<h1>Title of the page!</h1>\n<h2>Less important title</h2>", layout: false %></pre></code></p>
<p>Paragraphs: <pre><code class="html"><%= erb "<p>Hello! This is a paragraph.</p>", layout: false %></code></pre></p>
<p>Links: <pre><code class="html"><%= erb "<a href=\"http://wikipedia.org\">Click here!</a>", layout: false %></code></pre></p>
<p>Images: <pre><code class="html"><%= erb "<img src=\"myimage.jpg\">", layout: false %></code></pre></p>
<p>Lists</p>
<pre><code class="html"><%= erb "<ul>\n <li>First item</li>\n <li>Second item</li>\n <li>Third item</li>\n</ul>", layout: false %></code></pre>
</div>
<script>
function checkHomework() {
var html = editor.getValue()
var a = preview().find('li a')
if(a.length == 0) {
notok("I don't see a link in your &lt;li&gt;&lt;/li&gt;, try adding one.")
return
}
if(a.attr('href') === undefined || a.attr('href') == '') {
notok('You need to add an <strong>href</strong> to your <strong>a</strong> tag, like: <strong>href="//neocities.org"</strong>')
return
}
if(a.text() == '' || a.text().match(/\s+/)) {
notok('You need to add a name for your link, which is the text between the &lt;a&gt; tag, and the closing tag &lt;/a&gt;')
return
}
sessionStorage.setItem('tutorialHtml', html)
ok('Great, you did it!', '/tutorial/html/9')
}
</script>