---
id: bad87fee1348bd9aedf08756
title: Prioritize One Style Over Another
challengeType: 0
videoUrl: ''
localeTitle: Priorize um estilo sobre outro
---
## Description
Às vezes, seus elementos HTML receberão vários estilos que entram em conflito entre si. Por exemplo, seu elemento h1
não pode ser verde e rosa ao mesmo tempo. Vamos ver o que acontece quando criamos uma classe que torna o texto rosa e depois aplicamos a um elemento. Nossa classe irá sobrepor a color: green;
do elemento body
color: green;
Propriedade CSS?
## Instructions
Crie uma classe CSS chamada pink-text
que forneça um elemento cor-de-rosa. Dê ao seu elemento h1
a classe de pink-text
.
## Tests
```yml
tests:
- text: Seu elemento h1
deve ter a classe pink-text
.
testString: 'assert($("h1").hasClass("pink-text"), "Your h1
element should have the class pink-text
.");'
- text: Seu <style>
deve ter uma classe CSS de pink-text
que altere a color
.
testString: 'assert(code.match(/\.pink-text\s*\{\s*color\s*:\s*.+\s*;\s*\}/g), "Your <style>
should have a pink-text
CSS class that changes the color
.");'
- text: Seu elemento h1
deve ser rosa.
testString: 'assert($("h1").css("color") === "rgb(255, 192, 203)", "Your h1
element should be pink.");'
```
## Challenge Seed
## Solution
```js
// solution required
```