Files
30-seconds-of-code/snippets/reset-all-styles.md
2018-03-04 14:29:24 +10:00

48 lines
1.2 KiB
Markdown

### Reset all styles
Resets all styles to default values with one property. This will not affect `direction` and `unicode-bidi` properties.
#### HTML
```html
<div class="reset-all-styles">
<h4>Title</h4>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure id exercitationem nulla qui repellat laborum vitae, molestias tempora velit natus. Quas, assumenda nisi. Quisquam enim qui iure, consequatur velit sit?</p>
</div>
```
#### CSS
```css
.reset-all-styles {
all: initial;
}
```
#### Demo
<div class="snippet-demo">
<div class="snippet-demo__reset-all-styles">
<h3>Title</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure id exercitationem nulla qui repellat laborum vitae, molestias tempora velit natus. Quas, assumenda nisi. Quisquam enim qui iure, consequatur velit sit?</p>
</div>
</div>
<style>
.snippet-demo__reset-all-styles {
all: initial;
}
</style>
#### Explanation
The `all` property allows you to reset all styles (inherited or not) to default values.
#### Browser support
<span class="snippet__support-note">⚠️ MS Edge status is under consideration.</span>
* https://caniuse.com/#feat=css-all
<!-- tags: visual -->