Skip to content

Instantly share code, notes, and snippets.

@bogoreh
Created March 11, 2021 12:13
Show Gist options
  • Select an option

  • Save bogoreh/0f4d690e1d853b13888ed9382fe5753e to your computer and use it in GitHub Desktop.

Select an option

Save bogoreh/0f4d690e1d853b13888ed9382fe5753e to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Spin-off of "Challenge: Style guide"</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poiret+One">
</head>
<body>
<h1>Style guide</h1>
<p>The hottest color to wear right now is:
<span id="trendy-color">?</span>
</p>
<p>This is the trendy way to sign an autograph:
<span id="trendy-handwriting">?</span>
</p>
<p>This is the trendy way to frame photographs:
<br>
<img id="trendy-frame" src="https://www.kasandbox.org/programming-images/avatars/mr-pink.png" alt="Mr. Pink, so called because he is red.">
</p>
<script>
var colorEl = document.getElementById("trendy-color");
var handEl = document.getElementById("trendy-handwriting");
var frameEl = document.getElementById("trendy-frame");
colorEl.innerHTML = "blanched almond";
colorEl.style.backgroundColor = "black";
colorEl.style.color = "blanchedalmond";
handEl.innerHTML = "Squidman44"
handEl.style.fontFamily = "cursive";
handEl.style.fontSize = "20px";
handEl.style.backgroundColor = "black";
handEl.style.color = "blanchedalmond";
frameEl.style.border = "5px inset blanchedalmond";
var mrpinkEls = document.getElementsByTagName("img");
for(var i = 0; i < mrpinkEls.length; i++){
mrpinkEls[i].height = 100;
mrpinkEls[i].title = mrpinkEls[i].alt
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment