---
id: 5d822fd413a79914d39e98cc
title: Hatua ya 4
challengeType: 0
dashedName: step-4
---

# --description--

Ndani ya kipengele cha `head`, ongeza kipengele cha `meta` chenye `charset` ya `UTF-8`, kipengele cha `title` chenye kichwa cha `City Skyline`, na kipengele cha `link` kinachounganisha faili yako ya `styles.css`.

# --hints--

Unapaswa kuunda kipengele cha `meta` ndani ya kipengele cha `head`.

```js
assert.exists(document.querySelector('head > meta'));
```

Unapaswa kuipa tagi ya `meta` `charset` ya `UTF-8`.

```js
assert.equal(document.querySelector('head > meta')?.getAttribute('charset')?.toLowerCase(), 'utf-8');
```

Msimbo wako unapaswa kuwa na kipengele cha `title`.

```js
const title = document.querySelector('title');
assert.exists(title);
```

Kipengele cha `title` kinapaswa kuwa ndani ya kipengele cha `head`.

```js
assert.exists(document.querySelector('head > title'));
```

Mradi wako unapaswa kuwa na kichwa cha `City Skyline`.

```js
const title = document.querySelector('title');
assert.equal(title.text.toLowerCase(), 'city skyline')
```

Kumbuka, ukubwa wa herufi na tahajia ni jambo la muhimu katika kichwa.

```js
const title = document.querySelector('title');
assert.equal(title.text, 'City Skyline');
```

Msimbo wako unapaswa kuwa na kipengele cha `link`.

```js
assert.match(code, /<link/)
```

Hupaswi kubadilisha tagi zako za `head` zilizopo. Hakikisha kuwa hukufuta tagi ya kufunga.

```js
const heads = document.querySelectorAll('head');
assert.equal(heads?.length, 1);
```

Unapaswa kuwa na kipengele kimoja cha kujifunga cha `link`.

```js
assert(document.querySelectorAll('link').length === 1);
```

Kipengele chako cha `link` kinapaswa kuwa ndani ya kipengele chako cha `head`.

```js
assert.exists(document.querySelector('head > link'));
```

Kipengele chako cha `link` kinapaswa kuwa na sifa ya `rel` yenye thamani ya `stylesheet`.

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

Kipengele chako cha `link` kinafaa kuwa na sifa ya `href` yenye thamani `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>

  </head>
--fcc-editable-region--
  <body>
  </body>
</html>
```
