CSS attribute operation

CSS property manipulation font property color font color font-size font size (24px) font-weight font-family font style text property text-align:center/left/right/justify text-decoration:none /underline/overline/line-through text-indent:32px Background attribute color: red #4e4e4e rgb(128,128,128) rgba(128,128,128,0.5) backgroud-color backgroud-image The default is to fill this area and the browser window can treat it as A three-dimensional coordinate system, horizontal X, vertical Y, point to the user’s Z backgroud-repeat: no-repeat/repeat-x/repeat-y backgroud-position: center center The first one up and down, the second left and right support the shorthand backgroud:red url(” ) No-repeat center center background image application scenario All browsers you can see are transmitted via the Internet request. When your website needs a lot of small icons, you can put all the small pictures in one On the picture, the position of the background picture is used to control which small picture is displayed to save loading resources. Border attributes border-style:solid/dotted/dashed border-color:red border-width:5px Support abbreviation border:3px solid red; border -top/left/right/bottom box model takes the express box as an example margin: outer margin (the distance between the label and the label) border: border padding: inner padding and inner margin content: text content margin-top/left/right/ Bottom margin: 1 2 3 4 padding: 1 2 3 4 Floating float Floating is out of the document flow and no longer follows the block-level exclusive line feature. Floating is mainly used for page layout floats that will cause the problem of parent label collapse. Clear clear floats The impact clear:left/right/both .clearfix:after{ content:” display:block; clear:both} Add one to whoever collapses The clearfix class attribute can be used. If adding to the current label has no effect, then you can consider adding a div to the outer layer of the target label, and then add whether the new div is out of the document flow or not 1. Floating 2. Absolute positioning 3. Fixed positioning does not break away 1. Relative positioning positioning. All labels are static by default. There is no positioning. If you want to change the position of the label, you need to change the position of the label position: static 1. Relative positioning relative 2. Absolute positioning absolute 3. Fixed positioning fixed overflow property overflow :hidden,scroll,auto z-index modal box (Baidu login page) opacity transparency