Summary of daily knowledge points (1) and summary of knowledge points
Summary of front-end specifications
Html:
1: Nested nodes should be indented with four spaces
2: The attribute uses double quotation marks (eg: class = ""
3: You do not need to close a single tag ('<br> 4: All codes use only lowercase letters.
5: Define the encoding method '<meta charset = "UTF-8">'
6: 'type' is not required when 'css 'and 'javascript' are introduced'
7: HTML attribute writing sequence id --> class --> name --> data-* --> src, for, type, href --> title, alt
8: avoid generating tags in JavaScript files whenever possible
9: each block element, list element, or table element excludes one row.
10: Semantic
Css:
1: indent: 4 spaces
2: Space: space 1, space 2 (':' and 'attribute value' must contain spaces)
. Selector {
Padding: 0px;
}
3: id name: camper name. Do not use id as the style control class name: hyphen
4: All class names, except for public styles, must start with the name of the current module or abbreviated name, ". modelName" + "-" + className.
Eg:. login-label. login-input
5: Each selector declaration must have an exclusive row
Eg:. post,
. Page,
. Comment {
Line-height: 1.5;
}
6: the nesting level of the selector should not be greater than 'level 3'
7: Attributes must end with a semicolon.
8: attribute writing: 'layout positioning attribute'> 'own attribute'> 'text attribute'> 'other attributes
Layout positioning attributes: margin/padding/float/clear/position (top, right, bottom, left)
/Display/visibility/overflow/z-index (cascade order)
Attributes: width/height/background/border/outline
Text attributes: font/color/text-align/text-decoration/vertical-align/line-height
/Text-indent/white-space/list-style (list style)/content, etc.
Other attributes: cursor/zoom
9: the path in the 'url () 'function is not enclosed by quotation marks.
10: The color value cannot be named. The color value is case-insensitive.
11: background; both the horizontal and vertical directions must be given.
12: Font: SimSun SimHei, SimHei, Microsoft, Microsoft YaHei
13: 'line-height' numeric values should be used when defining text paragraphs. When 'line-height' is used to control the vertical residence, it should still be set to be consistent with the container height.
Eg:. container {
Line-height: 1.5;
}
14: The 'hack' attribute follows the corresponding attribute