Html/Css (first entry for beginners) and css beginners

Html/Css (first entry for beginners) and css beginners

1. Understand the meaning of web standards-why web standards are adopted
***** Separate content from style
1. web standards are a series of standards and a series of technical standards
In use, it is a combination of applications
[1]. structured content xhtml
[2]. css
[3] JavaScript
2. Web development gadgets-firebug in Firefox
Tools-additional components-search for firebug
As a web Front-end job, it should be compatible with Browser IE, Firefox browser, Google Liu browser, and Apple browser.
Whether the webpage has a css style. Test-change the text size in the browser.
3. css definition skills:
[1]. For future css code optimization, we recommend that ";" be followed by all attribute values.
[2]. Some xhtml labels have their own default css attribute values,
For example, the h1 tag has its own property value, which is automatically displayed in bold and has a large font size.
[3]. To be compatible with mainstream browsers and be unified, we recommend that you set the css attribute of all elements to standard.
[4]. Different browsers have their own unsupported css attribute values-the worst thing is browser compatibility.
[5]. What should I do if I want to use a special font? -- Convert it to an image.
In Chinese and English. Set the font order. Set the English font to the front and the Chinese character to the back.
[6] css editing tools-use anything, master, and use leaves to kill people
[7]. to center the text vertically, set the Row Height to the element height, and the Row Height = the element height.
[8], css can be reset, the default style of the xhtml label.
4. How css applies to web pages: It is equivalent to how people wear clothes.
[1]. Intra-row style: Apply to one.
[2] embedded style: applied to a class of labels.
[3]. If we have a lot of web pages, we should use css to write these css into an independent file. This is an external chain, which is recommended.
[4]. Imported style: The style is also written to a file and then poured into the webpage.
* *** It indicates that the imported style is similar to the embedded style, and is added to the webpage.
1. Imported files occupy html file space.
2. Some browsers may cause problems in parsing. The browser finally reads the content in @ import.
3. Import multiple style files to one style file.

Ii. css features
Css is called a stacked style sheet.
1. Inheritance: child elements inherit certain styles of the parent element.
[Because some child elements have their own default values, they do not need a parent element]
2. Stacked: if a child element defines the same style as the parent element, it overwrites the style of the parent element.
* ***** The subsequent style will overwrite the previous Style

Iii. Priority of css styles: who will listen to when there is a conflict between styles?
Css priority: proximity principle
The smaller the scope, the higher the priority.
The higher the style priority, the closer the target to be modified.

Grandpa -- red
Dad -- green
Child-blue
Select priority
Line> id> class> label Selector
In special cases, we can enhance the permission of a property.
* *** IEtest tool also has a compatibility problem. In win7, ie6. -- download the green version of ie6. Which version is directly used without installation.

4. common text and css styles controlled by text
* ***** When applying css styles, pay attention to its default value. Because different browsers have different default css values (different attribute browsing
Server support is different. We also need to ensure the compatibility of our web pages, and try to use the passed attributes as much as possible, without having to have properties with different compatibility .)

5. A certain state of css control elements-pseudo class
Pseudo Syntax:
Element name: pseudo class name {attribute: Value}
For example, the mouse of a hyperlink goes through the status
A: hover {text-decoration: underline ;}
* If the mouse-over effect does not work, modify the sequential L-V-H-A of the connection status