Still there? Well done! But hold on, here begins the serious part... In order to control your creation, you're going to plug its brain: JavaScript.
[`Link a JS script`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script) to your `bring-it-to-life.html` file.
[`Link a JS script`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script) to your HTML file.
In this script, you're going to close the left eye of your entity.
To do so, you have to target the `eye-left` HTML element by its `id` thanks to the [`getElementById`](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById) method. Then, [change the `style`](https://developer.mozilla.org/en-US/docs/Web/API/ElementCSSInlineStyle/style#setting_styles) of your `eye-left` to set its background color to black. We also need to modify its shape ; for that we are going to add a new class to it.
@ -22,7 +22,7 @@ Let's add new elements and wrap them in different layers ; convert this list of
Modify your CSS file to add rulesets to `section` tags: `display` at "flex" and `justify-content` at "center" (this is to turn the `section` tags into [`flex` containers](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox), so the elements inside will be centered)
Add also the following CSS to your `styles.css` file to see the freshly-added nested elements:
Add also the following CSS to your CSS file to see the freshly-added nested elements:
@ -7,7 +7,7 @@ The first step to achieve in your quest is to conceive your being ; for that, 2
#### Parameters
To create any project, some things need to be declared in the `index.html` file - those are not visible elements in your page, but things cannot work without them.
To create any project, some things need to be declared in the HTML file - those are not visible elements in your page, but things cannot work without them.
Set your page with [`<html>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/html) & [`<head>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/head) tags, and also put a [`<title>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/title) to name the entity you're going to create.
#### Structure
@ -19,7 +19,7 @@ Let's define the first level of elements that your entity will be made of ; we'r
Inside the `<body>` tag of your HTML file, create 3 divisions using `<section>` tags, putting the following text content inside for each: 'face', 'upper-body', 'lower-body'.
If you open you `index.html` file in the browser, you should see those 3 texts appear on the screen.
If you open you HTML file in the browser, you should see those 3 texts appear on the screen.
