Tutorial by Examples

An external CSS stylesheet can be applied to any number of HTML documents by placing a <link> element in each HTML document. The attribute rel of the <link> tag has to be set to "stylesheet", and the href attribute to the relative or absolute path to the stylesheet. While usin...

CSS enclosed in <style></style> tags within an HTML document functions like an external stylesheet, except that it lives in the HTML document it styles instead of in a separate file, and therefore can only be applied to the document in which it lives. Note that this element must be insid...

Use inline styles to apply styling to a specific element. Note that this is not optimal. Placing style rules in a <style> tag or external CSS file is encouraged in order to maintain a distinction between content and presentation. Inline styles override any CSS in a <style> tag or extern...

The @import CSS at-rule is used to import style rules from other style sheets. These rules must precede all other types of rules, except @charset rules; as it is not a nested statement, @import cannot be used inside conditional group at-rules. @import. How to use @import You can use @import rule ...

Pure JavaScript It's possible to add, remove or change CSS property values with JavaScript through an element's style property. var el = document.getElementById("element"); el.style.opacity = 0.5; el.style.fontFamily = 'sans-serif'; Note that style properties are named in lower came...

There are three different properties for styling list-items: list-style-type, list-style-image, and list-style-position, which should be declared in that order. The default values are disc, outside, and none, respectively. Each property can be declared separately, or using the list-style shorthand p...