Fixed position

No matter how the page scrolls, it's always there. top:100px; left:100px;Copy the code

Fixed positioning precautions

Fixed positioning can only take the page as a reference point, there is no child must parent phase nature

Fixed location out of standard document flow

Fixed positioning small case

<! DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta < span style> body {height:800px; color: RGB (0, 0, 0); /* background:blue; */ } .block { width:80px; height:80px; line-height:80px; text-align:center; border:2px solid black; } .block:nth-child(1) { position:absolute; top:10px; left:20px; } .block:nth-child(2) { position:fixed; top:10px; left:20px; } < / style > < / head > < body > < div class = "block" > absolute positioning < / div > < div class = "block" > fixed locate < / div > < / body > < / HTML >Copy the code