Web standards divide web pages into three independent components:
* Structure: HTML, XHTML, XML
* Performance: CSS1, CSS2
* Behavior: ECMAScript, DOM
Web standards so far have no guidelines or precepts on appearance and aesthetics, and they do not impose any restrictions on the appearance and feel of the site. They only enable the browser to correctly display the site created by the designer and help customers meet the company's market needs and needs. User analysis to develop goals.
Web standards can do:
* More precise control, positioning and layout on graphical browsers
* Complex interactive behavior
*Accessibility
* Support multiple browsers
* Works on both old and new browsers
* Guaranteed to work on future browsers
* Reduced website redesign time
* Support non-traditional devices
* Easily provide a print-friendly version of any web page
* Easily redesign documents during the release process
* Convert HTML to XML-based markup language
Reasons to use web standards:
* Enhance interaction capabilities
* Enhance accessibility
* Reduce maintenance workload
* Reduce bandwidth
* Reduce costs
XHTML is an XML-based markup language that looks similar to HTML, with some small but important differences. You can look at it this way, XHTML is XML that plays a role similar to HTML.
In essence, XHTML is a bridging (transition) technology that combines the power of XML (somewhat) with the simplicity of HTML (mostly).
----Jeffery Zeldman
10 reasons to switch to XHTML:
*XHTML is the current standard replacement for HTML4 markup language.
* XHTML can interact well with other XML-based markup languages, applications and protocols.
* XHTML has better consistency than HTML.
* XHTML1.0 is the bridge to future versions of XHTML
* Older browsers can adapt to XHTML
* New browsers favor XHTML over HTML
* XHTML works well on wireless devices and other user agents.
* XHTML is part of the family of Web standards
* XHTML can help you get rid of bad habits of presentation layer code
* XHTML can help you get into the habit of tagging validation to test that your page works
XHTML rules:
* Start with the correct DOCTYPE and namespace
* Use the META content element to declare your content encoding language
* Write all element and attribute names in lowercase letters
* Add quotation marks to all attribute values, and separate attributes with spaces.
* Assign a value to all attributes
* Close all tabs
* Close empty tags with spaces and slashes
* Do not use in comment content
* Make sure to use < and & for < and &.
There are three types of DTDs provided by XHTML1:
* Transitional, transitional, the most lenient DTD, the only DTD that tolerates presentation layer tags, junk elements and attributes
* Strict, strict,
* Frameset, frame,
XHTML declaration content encoding method:
* XML prolog, that is, but most browsers do not handle this
* Insert the Content-Type element to specify the encoding language,
* Set the encoding language through the HTTP header returned on the web server. This method is recommended by w3c.
General mechanism for adding structure
* The DIV and SPAN elements, combined with the id and class attributes, provide a common mechanism for adding structure to documents.
* These elements define built-in content (SPAN) and block level (DIV) without introducing other presentation layer things into the content.
* The ID attribute is similar to the label of a special area in the code, indicating that area requires special processing. When an ID attribute value is used in a specially set CSS, it is called a CSS selector. ID is the easiest and most versatile way to create a selector.
* The name of the ID must start with a letter and an underscore, and cannot start with a number.
ID function
* As a style sheet selector, minimize XHTML page files;
* As the anchor of a hyperlink, replacing the outdated name attribute;
* Method to reference elements in DOM script;
* As a declared object element name;
* As a tool for general purpose process processing.
# A style sheet is a collection of one or more rule definitions that determine how selected elements are displayed.
# A CSS definition consists of two parts: selectors and declarations. Among them, the declaration is also a collection. The collection elements are placed within a pair of {}. Each element ends with;. Each element consists of two parts: attributes and values. The attributes and values are separated by:.
# The selector starting with # is the id selector, and the selector starting with . is the selector.
# Multiple selectors can share the same statement, in which case different selections are separated by commas.
# According to CSS, child elements of the page inherit properties from the parent element, but some old browsers do not support it (such as Netscape 4). If you do not want the child element to inherit the characteristics of the parent element, the child element can freely define related attributes.
# CSS is not case sensitive, but when associated with an HTML file, category and id names are case sensitive.
# In order to facilitate editing of CSS, you can add some spaces or newlines.
# Style sheets can affect page display in three ways
1. Outreach/import
<link rel=StyleSheet href=/styles/mystylesheet.css type=text/css media=all />
or
<style type=text/css media=all>
@import /styles/mystylesheet.css;
</style>
or
<style type=text/css media=all>
@import url(/styles/mystylesheet.css);
</style>
Note: @Import method is only supported by browsers above 5.0