900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > 实现一个div的背景颜色从左到右慢慢出现

实现一个div的背景颜色从左到右慢慢出现

时间:2022-10-06 17:15:06

相关推荐

实现一个div的背景颜色从左到右慢慢出现

怎样实现一个div的背景颜色从左到右慢慢出现?

在这里为大家介绍伪类 :after

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Title</title><style>.btn button {position: relative;}.btn button::after {content: '';position: absolute;left: 0;top: 0;bottom: 0;right: 0;transition: .3s;opacity: .3;background: #000;transform-origin: left;transform: scaleX(0);}.btn button:hover::after {transform: scaleX(1);}.btn button{background-color: red;width: 200px;height: 40px;border: none;outline: none;cursor: pointer;color: white;}</style></head><body><div class="btn"><button>按钮</button></div></html>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。