Skip to content

Instantly share code, notes, and snippets.

View outoftime's full-sized avatar

Mat Brown outoftime

160 followers · 8 following
View GitHub Profile
@outoftime
outoftime / README.md
Created September 27, 2017 00:59
Exported from Popcode. Click to import: https://popcode.org/?gist=a6272abd6c174b7680a493d32f205d07

Ransom Note

Can you decode the ransom note by changing the CSS, without changing the HTML?

If you finish early…

  • Can you change the ransom note so that it uses your favorite colors?
  • Without changing the HTML, can you make the ransom note appear more like a normal sentence?
@outoftime
outoftime / README.md
Created September 27, 2017 00:58
Exported from Popcode.

Ransom Note

Can you decode the ransom note by changing the CSS, without changing the HTML?

If you finish early…

  • Can you change the ransom note so that it uses your favorite colors?
  • Without changing the HTML, can you make the ransom note appear more like a normal sentence?
@outoftime
outoftime / INSTRUCTIONS.md
Last active September 27, 2017 00:58
Exported from Popcode. Click to import: https://popcode.org/?gist=2ba730919fa5db2aef9ae2e1af3e0715

Ransom Note

Can you decode the ransom note by changing the CSS, without changing the HTML?

If you finish early…

  • Can you change the ransom note so that it uses your favorite colors?
  • Without changing the HTML, can you make the ransom note appear more like a normal sentence?
@outoftime
outoftime / INSTRUCTIONS.md
Last active September 26, 2017 23:20
Exported from Popcode. Click to import: https://popcode.org/?gist=ec6ff9b4fe45890d54857bd39b2d77a4

Wanted Poster

Your classmate is wanted for having serious STYLE! Your task is to create a “wanted poster” for someone else in the class.

1

Fill in the content in the <h1>, <h2>, <img>, and <p> tags.

2

@outoftime
outoftime / INSTRUCTIONS.md
Last active September 26, 2017 23:08
Exported from Popcode. Click to import: https://popcode.org/?gist=59999564236d59766958618b05845fb2
  1. Let's change the font of the header to something that looks like it would go on a Wanted poster! (Note: The teacher can show a simple font example, but if time allows, navigate to Google fonts and demonstrate how to imbed a font. "Ewert" is a good example for this activity).
  2. Let's change the size of the image so we can see it.
  3. Let's put a dashed border around the image.
  4. Let's align all text in the center.
@outoftime
outoftime / INSTRUCTIONS.md
Last active September 23, 2017 20:46
Exported from Popcode. Click to import: https://popcode.org/?gist=bb9e6571170515dbe3b489c60af04b64

Images Practice

  1. Edit the HTML so that the heading and image are for your favorite musician
  2. Add two more musicians to the page (name and image)

If you finish early:

  • Make it so that each image links to a video of one of the musician’s popular songs (cliking on the picture should take you to the video)
  • Make it so that clicking the image opens the video in a new tab (you will need to Google this).
@outoftime
outoftime / index.html
Created September 23, 2017 20:43
Exported from Popcode. Click to import: https://popcode.org/?gist=445c5e89bba912ba7b0556a476b0bbb4
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>My favorite musicians</h1>
<h2>Justin Bieber</h2>
<p><img src="https://www.fuse.tv/image/544533319a9551c444000080/316/316/justin-bieber.jpg"></p>
@outoftime
outoftime / INSTRUCTIONS.md
Last active October 9, 2017 20:07
Exported from Popcode. Click to import: https://popcode.org/?gist=bbc778916981461e1980604d5476ba7b

Links Practice

  1. Make the words Brooklyn, New York link to https://www.nycgo.com/boroughs-neighborhoods/brooklyn.
  2. Make the words George Westinghouse, Jr. link to the Wikipedia page about George Westinghouse (the person).

If you finish early…

Below the paragraph, make a bulleted list of three notable Westinghouse alumni.

Link each name to a page on the Internet with more information about them.

@outoftime
outoftime / index.html
Created September 4, 2017 16:16
Exported from Popcode. Click to import: http://localhost:3000/?gist=d330b207bd734c00390a85a073ec4f72
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
hey
</body>
</html>
@outoftime
outoftime / index.html
Created September 3, 2017 20:20
Exported from Popcode. Click to import: http://localhost:3000/?gist=bc8fca5e456c809b658370872a8b6f0c
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
</body>
</html>