Back to Freecodecamp

Step 1

curriculum/challenges/english/blocks/workshop-flappy-penguin/619665c9abd72906f3ad30f9.md

latest1.1 KB
Original Source

--description--

You will be building a happy Flappy Penguin, and further practicing CSS transforms and animations in the process.

Begin with linking your stylesheet to the page.

--hints--

Your code should have a link element.

js
assert.exists(document.querySelector('link'));

Your link element should be within your head element.

js
assert.match(code, /<head>[\w\W\s]*<link[\w\W\s]*\/?>[\w\W\s]*<\/head>/i);

Your link element should have a rel attribute with the value stylesheet.

js
const link_element = document.querySelector('link');
const rel = link_element.getAttribute("rel");
assert.equal(rel, "stylesheet");

Your link element should have an href attribute with the value styles.css.

js
const link = document.querySelector('link');
assert.equal(link.dataset.href, "styles.css");

--seed--

--seed-contents--

html
<!DOCTYPE html>
<html lang="en">
--fcc-editable-region--
  <head>
    <meta charset="UTF-8" />
    <title>Penguin</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  </head>
--fcc-editable-region--
  <body>
  </body>
</html>
css