下位三角例子
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <div> </div> </body> </html> <style> div { width: 200px; height: 20px; border: 1px solid; position: relative; transition: all .5s linear; } div::after { position: absolute; top: 2px; right: 10px; content: ''; width: 10px; height: 10px; border-bottom: 1px solid red; display: block; transform: rotate(45deg); border-right: 1px solid red; } div:hover::after { transform: rotate(225deg); top: 8px } </style>
标签:伪类,solid,after,1px,10px,div,border,css From: https://www.cnblogs.com/dming4/p/17581231.html