<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <style> .bar{ width:150px; height:15px; border:1px solid red; border-radius: 6px; padding:1px; } .bar_in{ width:50%; height:100%; background-color: black; transition:width 0.5s; } .bar:hover .bar_in{ width:100%; } </style> <body> <div class="bar"> <div class="bar_in"></div> </div> </body> </html>
进度条过渡效果
于 2022-05-13 15:44:23 首次发布