Javascript YouTube上的按钮是什么样的？

我想知道，我怎样才能在YouTube上产生这样的效果。 我的意思是，当我将鼠标悬停在按钮上时，它会变暗，当我单击它时，它会变为蓝色。 这是纯CSS还是也有JavaScript？（当然只有前端）

---

我应该使用什么类型的图标呢？

可以两者兼有，但当然可以使用纯css制作

这是对coment的编辑，但我做了一个给你看

#按钮{
光标：指针；
颜色：rgb（100,98,98）；
边界：无；
宽度：100px；
高度：50px；
}
#按钮：悬停{
背景：rgb（66,65,65）；
大纲：无；
}

悬停css
按这里！

使用CSS伪类可以轻松实现此效果

有了这些，你可以控制一个元素的样式，当指针在它上面时，点击它，等等

.css文件中的示例：

/*未访问的链接*/
a:链接{
颜色：#FF0000；
}
/*已访问链接*/
a:参观了{
颜色：#00FF00；
}
/*鼠标悬停链接*/
a:悬停{
颜色：#FF00FF；
}
/*选定链接*/
a:主动的{
颜色：#0000FF；
}

下面是有关伪类的更多信息的参考链接

---

悬停时的黑暗效果可以通过CSS伪选择器来实现

：hover

。单击时颜色变为蓝色取决于您的需要。如果您希望单击时颜色变为蓝色，释放鼠标时再次变为红色，则可以使用CSS伪选择器

：active

。但如果您希望鼠标释放后颜色永久变为蓝色，而不是变为红色，则可以使用javascript

1:带

：活动
：


.myButton{
填充：20px；
字体大小：24px；
背景色：#ff6347；
边框：2倍纯红；
}
.myButton:悬停{
背景色：#8b0000；
}
.myButton:活动{
背景颜色：蓝色；
}
单击我
这个“like”按钮必须是.svg、.png或一些Unicode？对于图标，最好的选择是使用.svg，它们响应迅速，重量轻。例如，为了使其更具dinamic，可以将.svg放在元素中，并使用css伪类使其根据操作更改颜色（或.svg，如果需要）。右键单击按钮并在开发工具中进行检查。作为一名网络开发人员，你首先需要学习的是@AdrianBrand，事实上，我不会问我是否从检查中知道这一点。