The CSS tutorial section of the site-Building Resources Network collects a large amount of CSS knowledge, which is already very comprehensive. However, many beginners of CSSer come to this site and are still in the fog, some basic knowledge about DIVCSS web page layout is now available for you to learn. You are welcome to add some suggestions.
CSS naming rules
I. File naming rules
Global style: global.css;
Frame layout: layout.css;
Font.css;
Link style: link.css;
Print Style: print.css;
Ii. Naming rules for common classes/IDS
Webpage: header
Content
Container: container
Footer: footer
Copyright: copyright
Navigation: menu
Main navigation: mainMenu
Subnavigation: subMenu
Logo: logo
Banner
Title: title
Sidebar: sidebar
Icon
Note: note
Search: search
Button: btn
Login: login
Link
Information Box: manage
......
The names of common classes should be based on common English words as much as possible, so that they are easy to understand and can be annotated in appropriate places. For the second-level class/ID naming, the composite writing mode is used, and the first letter of the last word should be written as follows: for example, the "search box" should be named "searchInput", "Search icon", and "Search button" should be named "searchBtn ".
CSS writing specifications and Methods
I. general writing specifications and Methods
1. Select DOCTYPE:
XHTML 1.0 provides three types of DTD declarations:
Transitional: requires a very loose DTD, which allows you to continue using the HTML4.01 logo (but it must conform to the xhtml syntax ). The complete code is as follows:
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
Strict: a Strict DTD is required. You cannot use any identifier or attribute of the performance layer, such as <br>. The complete code is as follows:
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Strict // EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd">
Framework: a dtd designed specifically for the Framework page. If your page contains a framework, you need to use this DTD. The complete code is as follows:
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Frameset // EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-frameset.dtd">
The ideal situation is of course a strict DTD, but for most of our designers who are new to web standards, the Transitional DTD (XHTML 1.0 Transitional) is currently an ideal choice (including this site, is also a transitional DTD ). Because this DTD also allows us to use the identifier, element, and attribute of the presentation layer, it is easier to pass W3C code verification.
2. Specify the language and character set:
Specify the language for the document:
<Html xmlns = "http://www.w3.org/5o/xhtml" lang =" en ">
To be correctly interpreted by the browser and validated by W3C code, all XHTML documents must declare the encoding languages they use. For example:
Common Language definitions:
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
Standard XML document language definition:
<? Xml version = "1.0" encoding = "UTF-8"?>