Responsive Web Design: Added hint to Prioritize One Style Over Another (#22020)

* Responsive Web Design: Added hint to Prioritize One Style Over Another

Added hint to Prioritize One Style Over Another (https://guide.freecodecamp.org/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another and https://learn.freecodecamp.org/responsive-web-design/basic-css/prioritize-one-style-over-another)

* Added   </style> in 23 line
This commit is contained in:
Gregory Gubarev
2018-11-18 07:20:03 +04:00
committed by Christopher McCormack
parent 9cb3bc280d
commit a33527523c

View File

@@ -3,8 +3,50 @@ title: Prioritize One Style Over Another
--- ---
## Prioritize One Style Over Another ## Prioritize One Style Over Another
This is a stub. <a href='https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another/index.md' target='_blank' rel='nofollow'>Help our community expand it</a>.
<a href='https://github.com/freecodecamp/guides/blob/master/README.md' target='_blank' rel='nofollow'>This quick style guide will help ensure your pull request gets accepted</a>.
<!-- The article goes here, in GitHub-flavored Markdown. Feel free to add YouTube videos, images, and CodePen/JSBin embeds --> <!-- The article goes here, in GitHub-flavored Markdown. Feel free to add YouTube videos, images, and CodePen/JSBin embeds -->
We need to create a CSS class called ```pink-text``` that gives an our ```h1``` element the color pink.
### Solution
Between ```<style>``` and ```</style>``` create a class called ```pink-text```:
```css
<style>
body {
background-color: black;
font-family: monospace;
color: green;
}
.pink-text {
}
</style>
```
And add in this class ```color``` with value of ```pink```:
```css
.pink-text {
color: pink;
}
```
After, add this class to our ```h1``` element:
```css
<h1 class="pink-text">Hello World!</h1>
```
### Full solution
```css
<style>
body {
background-color: black;
font-family: monospace;
color: green;
}
.pink-text {
color: pink;
}
</style>
<h1 class="pink-text">Hello World!</h1>
```