fix(guide): CSS- Added progressive enhancement css (#18749)

pull/19352/head
Dhanajayan k 2018-10-16 01:07:29 +05:30 committed by Quincy Larson
parent f111fa05c8
commit 629ae368b9
1 changed files with 17 additions and 7 deletions

View File

@ -3,11 +3,21 @@ title: Progressive Enhancement
---
## Progressive Enhancement
This is a stub. <a href='https://github.com/freecodecamp/guides/tree/master/src/pages/css/progressive-enhancement/index.md' target='_blank' rel='nofollow'>Help our community expand it</a>.
Progressive enhancement is the practice of building an application for a base level of user experience, but adding functional enhancements when a browser supports it.
Progressive enhancement is similar concept to graceful degradation but in reverse. It does not require us to select supported browsers or revert to table-based layouts. We choose a level of technology; i.e. the browser must support HTML 4.01 and standard page request/responses.
CSS has changed a lot in the last years. More and more properties were added and while some are now supported in all modern browsers some only work in one or two browsers. In any way, we can often make use of the architecture of CSS. If a browser doesnt know a property it will simple skip it without throwing an error.
### Example
```css
h2 {
color: black;
color: rgba(0,0,0,0.9);
}
```
In this case all browsers supporting rgba() will use the rgba() value for the color property. However, browsers not supporting rgba() will ignore this and use the value “black” for the color.
### More information
<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 -->
#### More Information:
<!-- Please add any articles you think might be helpful to read before writing the article -->
[JustMarkup.com](https://justmarkup.com/log/2017/02/css-and-progressive-enhancement/)