Instruções
Projetar uma Página de Avaliação de Filmes
Objetivo: Cumprir as user stories abaixo e fazer todos os testes passarem para completar o laboratório.
Histórias de Usuário:
1. Você deve ter apenas um elemento
main.
2. Dentro do elemento main, você deve ter um elemento h1 para o título do filme.
3. Abaixo do elemento h1, você deve ter um elemento img exibindo a capa do filme. Seu elemento img deve ter um texto alt descritivo que descreva a imagem. Você pode usar a seguinte imagem, se desejar: https://cdn.G.E.A.R ACADEMY.org/curriculum/labs/rise-beyond-2.png.
4. Você deve ter um elemento p contendo uma breve descrição do filme.
5. Você deve ter outro elemento p para exibir a classificação do filme. Dentro dele, você deve ter estes itens na ordem listada:
- Um elemento
strongcom o textoMovie Rating:. - Um elemento
spancom um atributoaria-hiddendefinido comotruecontendo uma representação visual da avaliação usando estrelas⭐⭐⭐⭐⭐⭐⭐⭐⭐☆. - Um valor numérico, representando a avaliação, entre parênteses (por exemplo,
9.2/10) após o span.
h2 com o texto Cast Members.
7. Você deve ter um elemento ul.
8. Dentro do elemento ul, você deve ter múltiplos elementos li, cada um contendo um elemento strong para o nome do ator seguido pelo nome do personagem correspondente precedido pelo texto as. (ex.: James Holloway as Ethan Carter).
O que fazer:
Testes:
- Você deve ter apenas um elemento `main`.
- Dentro do elemento `main`, você deve ter um elemento `h1` contendo o título do filme.
- Abaixo do elemento `h1`, você deve ter um elemento `img` com um atributo `alt` descritivo.
- Você deve ter um elemento `p` após a imagem que contenha a descrição do filme.
- Você deve ter outro elemento `p` que contenha a avaliação.
- Dentro do segundo elemento `p`, você deve ter um elemento `strong` com o texto `Movie Rating: `.</dfn>
- Deve haver um elemento `span` dentro do parágrafo de avaliação.
- O elemento `span` dentro do parágrafo de avaliação deve conter dez estrelas, preenchidas (⭐) ou vazias (☆), seguidas por um valor numérico entre parênteses após o `span`.
- O elemento `span` dentro do parágrafo de avaliação deve ter um atributo `aria-hidden` definido como `true`.
- Você deve ter um elemento `h2`.
- Seu `h2` deve vir após seu segundo elemento `p`.
- Seu `h2` deve conter o texto `Cast Members`.
- Você deve ter um elemento `ul` após o `h2`.
- O `ul` deve conter múltiplos elementos `li`.
- Cada `li` deve conter um elemento `strong` para o nome do ator seguido pelo nome do personagem correspondente precedido pelo texto `as`. (ex.: `James Holloway as Ethan Carter`).
Preview