freeCodeCamp/curriculum/challenges/italian/14-responsive-web-design-22/learn-responsive-web-design.../612e804c54d5e7308d7ebe56.md

61 lines
1.2 KiB
Markdown

---
id: 612e804c54d5e7308d7ebe56
title: Step 5
challengeType: 0
dashedName: step-5
---
# --description--
All'interno dell'elemento `.keys`, aggiungi sette elementi `div`. Assegna a tutti la classe `key`.
# --hints--
Dovresti creare sette nuovi elementi `div`.
```js
const divDivDiv = document.querySelectorAll('div');
assert(divDivDiv?.length === 9);
```
I sette nuovi elementi `div` dovrebbero essere all'interno dell'elemento `.keys`.
```js
const keys = document.querySelector('.keys');
assert([...keys?.children].length === 7);
assert([...keys?.children].every(child => child?.tagName === 'DIV'));
```
I sette nuovi elementi `div` dovrebbero tutti avere l'attributo `class` con il valore `key`.
```js
const keys = document.querySelector('.keys');
assert([...keys?.children].every(child => child?.classList?.contains('key')));
```
# --seed--
## --seed-contents--
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Piano</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
--fcc-editable-region--
<div id="piano">
<div class="keys"></div>
</div>
--fcc-editable-region--
</body>
</html>
```
```css
```