Html/Css (the first must-read guide for beginners)

1. Understanding the meaning of web standards-Why adopt web standards

***** Separate content from style

1. Web standards are a series of standards, that is, a series of technical standards that are used in combination [1], structured content xhtml
【2】、Expression content CSS
【3】Behavioral content JavaScript

2. A small tool for web development - Firebug in Firefox
Tools - Add-ons - Search for firebug
As a web front-end work, compatible browsers are required, such as IE, Firefox, Google Chrome, Safari, etc.
Whether the webpage has CSS style, test - change the text size in the browser.

3. CSS definition skills:
[1] For future CSS code optimization, it is recommended that all attribute values ​​be followed by a “;”
[2] Some XHTML tags have their own default CSS attribute values.

For example, the h1 tag has its own attribute value, which automatically displays in bold and with a larger font size.
【3】In order to be compatible with mainstream browsers and for uniformity, it is recommended that you reset the CSS properties of all elements to the standard ones when setting them.
【4】Different browsers have their own incompatible CSS attribute values ​​- the most important thing is browser compatibility.
【5】What should I do if I want to use a special font? --Convert it into a picture.

Divided into Chinese and English fonts. Set the order of the fonts, with English fonts in front and Chinese fonts in the back.
[6] CSS editing tool - you can use anything. Experts can kill people with leaves. [7] If you want to center the text vertically, set the line height to the height of the element. Line height = element height. [8] CSS can be reset to the default style of xhtml tags.

4. The way CSS is applied to web pages is equivalent to how people put on clothes.
[1] Inline style: applied to one.
【2】Embedded style: Applied to a type of tag.
【3】If we have many web pages and all of them need CSS, we can write these CSS into a separate file. This is the external link style and is recommended.
【4】Imported styles: The styles are also written into a file and then imported into the web page.

*****Note: The import style is actually similar to the embedded style, both of which add styles to the web page.
1. Importing will take up space in HTML files
2. Some browsers may have parsing problems. The browser will read the content in @import last.
3. Import multiple style files into one style file.

2. Characteristics of CSS

CSS is called Cascading Style Sheets.

1. Inheritance: Child elements will inherit certain styles of parent elements.
[Because some child elements have default values, they don't need parent elements]

2. Overlay: If a child element defines the same style as the parent element, the style of the parent element will be overwritten.
*****The following styles will override the previous ones

3. CSS style priority: Who should you listen to when styles conflict?

CSS priority: The smaller the scope of the proximity principle, the higher the priority.
The closer the style is to the target, the higher the priority.

Grandpa -- Red Daddy -- Green Child -- Blue Selection priority Inline > id > class > tag selector In special cases, we can increase the permissions of a certain attribute
*****IEtest tool also has a compatibility issue and cannot open ie6 under win7.--Download the green version of ie6. No need to install which version to use directly.

4. Some commonly used text, CSS styles for text control

*****When we apply CSS styles, we must pay attention to its default values. Because different browsers have different CSS default values ​​(different browsers support different attributes, and we also need to ensure the compatibility of our web pages, try to use the attributes that are passed, and don't use attributes that have compatibility differences.)

5. CSS controls a certain state of elements-pseudo-class

Pseudo-class syntax:
Element name: pseudo-class name {attribute: value}
For example: the mouse over state of a hyperlink
a:hover{text-decoration:underline;}
*****If the mouse does not work, please modify the order of connection status LVHA

The above Html/Css (the first must-read guide for beginners) is all the content that the editor shares with you. I hope it can give you a reference. I also hope that you will support 123WORDPRESS.COM.

Original URL: http://www.cnblogs.com/xie-zhan/archive/2016/07/01/5631868.html