2. Combination selector (set like this for multiple tags) Example: body,div,{background-color:#36F;color:#F23;} 3. Pseudo-element selector Example: Hyperlink status a:link{}//Not visited a:hover{}//The effect of moving the mouse above a:action{}//Click effect a:visited{}//After-visit effect p:first-line The first line of text in the paragraph p:first-letter{}The first letter in the paragraph input:focus has The focus element layout: float positioning: position: Attribute: relative relative positioning is positioned according to the original position, and its original position is still Relative positioning down and to the right is the positive direction Absolute positioning: Compared to the nearest parent with positioning attributes, the position it originally occupied is gone z-index level attribute has no unit css text attribute: font-size can be set The size of the font em is a multiple of the character unit ex half the px pixel value text-align sets the text alignment left, right, center, justify both ends line-height sets the line height of the element text-indent first line indent font-weight text thickness set normal to display according to the standard, bold bold display font-style set text display style normal to display italic according to the standard oblique display text- decoration sets the text decoration style underline, underline, overline, and line-through strikethrough none to remove the text decoration style. font-variant font is uppercase small-caps is uppercase normal is standard lowercase color sets the font color font-family text font padding If there are two parameters for the padding, one up and two down If there are three parameters: one up, two left, three down, four parameters top right, bottom left padding-top padding-left padding-right padding-bottom margin outer margin, whichever one has a larger margin up or down will have the left and right value. The outer margin is the sum of the two outer margins margin: 0 auto; the top and bottom margins are 0 pixels, and the left and right margins are automatic, which is equivalent to centering and is suitable for block-level elements. The margins of inline elements are only left and right, not top and bottom margin can be set is a negative value, padding is not allowed Block-level elements do not set a specific width, the default is 100%. If a fixed height is not set, the height of the element will change according to the content Block-level tags are converted into row-level tags p {display:inline;} Row-level tags are converted to block-level tags a{display:block;} Row-level elements cannot set width and height Row-level elements cannot use margin: 0 auto; centering must be converted to block level Element overflow:hidden; Hiding overflowing text can solve the bug of nesting divs and adding float overflow:scroll; Add scroll bar overflow:auto; Automatically select clear:left; Clear on the left Floating background-image attribute: background image, does not affect the display of text background-image:url(dog.jpg); Set the background image background-repeat:; Control the repeating method of the background image background-position:100px 300px; controls the position of the background. The first parameter represents the distance from the left side of the element, and the second parameter represents the distance from the top of the element Set multiple elements at the same time: the order is background color background image Background image repetition method Background image distance from the left Distance from the background image from the top Background-attachment: fixed; Fixed background image CSS sprite technology: Let an element with a fixed size only display part of the background Example: background:url(dogs.jpg) no-repeat -370px -230px; Mouse style cursor: hand is the hand type pointer has strong hand type compatibility crosshair is the cross type text allows you to move to the text Effect wait is the effect of waiting. Default is the default effect. Help is a question mark. e-resize is an arrow to the right. ne-resize is an arrow to the right. nresize is an upward arrow. nw-resize is an arrow to the upper left. w-resize is to the left. Arrow sw-resize downward left arrow s-resize downward arrow se-resize downward right arrow auto The effect automatically given by the system The visibility attribute is used to control the hiding and display status of the element visible The current element is displayed Status hidden: The current element is in the hidden state. This attribute hides the element. The location is still there display: none; equivalent to not writing this element, and the position is gone opacity:0-1; (w3c standard) filter:alpha(opacity=0-100); (IE) list-style cancel li The far point in naming convention: id name must be unique. Class can have multiple styles with parent-child relationship, which should be reflected through naming. Reasonable annotation of camel case nomenclature: use_name_box or use-name-box Priority: Label selector
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
