zydronium/neocities
1
0
Fork 0
mirror of https://github.com/neocities/neocities.git synced 2025-04-26 18:22:38 +02:00
Code Issues Projects Releases Packages Wiki Activity

Merge branch 'master' of github.com:neocities/neocities

Browse source
This commit is contained in:
Kyle Drake 2015-11-28 02:45:59 -08:00
commit 3b5b9ce4dc
3 changed files with 12 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
public/img/tutorial/ch1pg2.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 111 KiB

After

Width:  |  Height:  |  Size: 72 KiB

BIN
public/img/tutorial/ch1pg2_2.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 32 KiB

16
views/tutorial/html/2.erb
View file

@ -1,17 +1,25 @@
<div class="comic" style="height: 600px; background-image: url(/img/tutorial/ch1pg2.png); background-size: 580px;">
<div class="comic" style="height: 608px; width:320px; background-image: url(/img/tutorial/ch1pg2.png); background-size: 320px; float: left;">
<div class="dialogue" style="left: 25px; top: 40px; width: 250px">
<p>All you need to build your first site is a computer language called HTML.</p><p>HTML is made of tags - there's usually an opening tag and a closing tag, with content in between them.</p>
</div>
<div class="dialogue" style="left: 430px; top: 0px;">
</div>
<div class="comic" style="width: 289px;
height: 588px;
background-image: url(/img/tutorial/ch1pg2_2.png);
background-size: 289px;
position: absolute;
right: -47px;
z-index: 1000;">
<div class="dialogue" style="left: 0px; top: 40px;">
And here's some HTML, right in this box! Let's make a change. Replace <strong>Hello World</strong> with <strong><span id="studentName"></span>'s Website</strong>, and click save!
</div>
<div class="dialogue" style="left: 370px; top: 260px;">
<div class="dialogue" style="left: 0px; top: 360px;">
<p>You'll see the results here.</p>
<p>Make sure to check the green boxes below for important bonus info!</p>
</div>
</div>
<div class="welcome">
<div class="welcome" style="clear: both">
<h4>Welcome to HTML!</h4>
<p>HTML stands for <strong>H</strong>yper<strong>T</strong>ext <strong>M</strong>arkup <strong>L</strong>anguage.
Hypertext refers to text that has links, and markup refers to the tags.</p>