HTML and CSS Reference
In-Depth Information
Quirks mode
When HTML and CSS became standardized by the World Wide Web Consortium (W3C),
web browsers could not just comply with the standards because doing so would break
most web sites already in existence. Browsers instead created two separate rendering
modes: one for new standard compliant sites and one for old legacy sites (quirks mode).
In full standards mode, the browser does its best to render the page in accordance
with HTML and CSS specifications. Browsers use the doctype for the sole purpose of
deciding between full standards mode and quirks mode. A valid doctype at the start of
a web document, such as the HTML 5 doctype seen following, ensures that the page is
rendered in full standards mode:
<!DOCTYPE html>
<html> ... </html>
This doctype triggers full standards mode in all major browsers, dating back as
far as IE6.
Vendor prefixes
Many browsers begin incorporating new CSS properties long before their specification
becomes stable. Because these implementations are experimental, their property names
include a vendor prefix to indicate that the specification could potentially change in
the future.
The major vendor prefixes include -moz for Firefox; -ms for Internet Explorer; -o for
Opera; and -webkit for Chrome, Safari, Android, and iOS. Recent versions of Opera also
implement the -webkit prefix in parallel with the -o prefix. For example, support for the
CSS 3 border-radius property can be increased by using the following vendor prefixes.
Note that the unprefixed version should always be included last.
.round {
/* Safari 3-4, iOS 1-3.2, Android 1.6-2.0 */
-webkit-border-radius: 3px;
/* Firefox 1-3.6 */
-moz-border-radius: 3px;
/* Opera 10.5+, IE9+, Safari 5+, Chrome 1+,
Firefox 4+, iOS 4+, Android 2.1+ */
border-radius: 3px;
As time goes on, the new property's specification becomes stable, and browsers
drop the vendor prefix. Given more time, web users abandon old browsers in favor of
new versions, and the need for vendor prefixes diminishes. This has already occurred for
the border-radius property, and developers are now encouraged to drop the prefixes,
making things a little easier for web developers worldwide.
Search WWH ::

Custom Search