html style attribute
The style attribute on the html element:
- → allows you to add "inline style" to an element
- is a global attribute → can be applied on all html elements;
- when applied on the root element <html>, its value is inherited by all other html elements
Warning: inline style should be avoided as much as possible, use CSS external style sheets instead.
Examples
| <html | attribute | = | "value(s)" | > | ... | <⁄html> | example |
|---|---|---|---|---|---|---|---|
| 18. | style | = | CSS property:value | < style="color:#fff"> ... <⁄> < style="font-weight:bold"> ... <⁄> < style="text-decoration:underline"> ... <⁄> |
Video demonstration html style attribute
HTML5 html style attribute Tutorial
| min | video details |
|---|---|
| 00:02 | launch "style.php" file in browser |
| 00:05 | open "style.php" file in Notepad++ |
| 00:11 | the value of the style attribute: CSSproperty:value |
| 00:15 | There are 3 different ways of stylying your web page, using: 1. external style - the most recommended 2. internal style 3. inline style - the less recommended |
| 00:15 | 1. external style - the most recommended |
| 00:20 | 2. internal style |
| 00:29 | 3. inline style - the less recommended: - adding the style attribute on html tag - adding one CSS property: "CSSproperty:value" - adding more than one CSS property : "CSSproperty1:value;CSSproperty2:value " |
| 00:39 | saving the modifications in Notepad++ and refreshing the file in browser |
| 00:42 | testing: <html style="color:#fff"> |
| 00:31 | result:the page's content is colored in white |