img style attribute
The style attribute on the img element:
- → allows you to add "inline style" to an embedded image through img tag
- 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
| <img | attribute | = | "value(s)" | > | Examples | ||
|---|---|---|---|---|---|---|---|
| 18. | style | = | CSS property | < src=".." alt="alt text " style="border:2px solid #0000ff;"> |
Video demonstration img style attribute
HTML5 img style attribute Tutorial
| min | video details |
|---|---|
| 00:05 | video tutorial: style attribute on img |
| 00:10 | the style attribute applied on img allows you to add inline style to the embedded image |
| 00:21 | we will add an inline style to the 1st image, making it to float to the right |
| 00:40 | the 1st image floats to the right |
| 00:40 | note: inline style is not recommended; use internal style if the style applies to 1 file or use external style sheet for style applying to multiple pages |