CSS glossary entries for ‘O’

opacity
The opacity property is a CSS property which sets the degree of semi-transparency (or opacity) in a selected area's content. The property is specified as a floating point number between 0 and 1: where the 0 equates to full transparency and 1 equates to completely opaque. The important point to remember about opacity is that should hardly ever be used when the selected elements have textual content, since it can significantly degrade the readability of that text. When you want readable text on a semi-transparent background, set a semi-transparent ‘background-color’ (using ‘rgba’ or ‘hsla’) or a semi-transparent ‘background-image’.
Out of order positioning
Is the use of CSS positioning properties to place selected content at a different position in the visual display order than it occupies in the HTML source code order. It is most commonly used by developers to place ‘page furniture’ (e.g. navigation) below the unique content of a page within the HTML, but above that content in the visual display.
outline
In CSS and outline is a rendered bounding box which looks and behaves very much like a border. Unlike ‘borders’, outlines are rendered over the outer portion of the ‘padding area’, i.e. their outer edge coincides with the ‘padding edge’ of selected elements. An outline is created using the CSS outline property. Like the ‘border’ property, outline is a shorthand for the outline-color, outline-style and outline-width properties.
outline-color
The outline-color property is a CSS property which specifies the colour of ‘outlines’.
outline-style
The outline-style property is a CSS property which specifies the type of line that an ‘outline’ is drawn with, e.g. solid, dotted, dashed, etc.
outline-width
The outline-width property is a CSS property which specifies the thickness of an ‘outline’
overflow
The overflow property is a CSS ‘shorthand property’ which allows the designer to set all the ‘overflow properties’ in s single statement. For the most part, overflow properties affect ‘float boxes’ and ‘positioned boxes’, since those ‘layout box’ types do not contribute to the ‘width’ or ‘height’ of their container. By contrast ‘statically positioned’ containers automatically expand to encapsulate their ‘static’ descendants.
overflow-x
The overflow-x property is a CSS property which specifies whether excess content should be allowed to visibly overflow the ‘inside edge’ of its parent container.
overflow-y
The overflow-y property is a CSS property which determines whether excess content should be allowed to visibly overflow the bottom edge of its parent container.
Overlapping margins
See ‘margin collapse’

The Web Design Academy Contact us

By form

By Phone

+44 (0)113 234 4611

By email

enquiries@thewebdesign.academy

By snail mail

Suite 3 15 South Parade Leeds LS1 5PQ United Kingdom