:focus :active arasındaki fark sınıflar pseudo nedir?

:focus :active iki farklı Birleşik Devletleri.

:focus öğe öğe şu anda giriş cihazlarından giriş almak için seçildiğinde devlet (klavye) temsil eder. :active öğe şu anda kullanıcı tarafından aktive edilirken, devleti temsil eder.

Hadi bir örnek ile perspektif içine koyalım. Hadi <button> bir söz. <button> ile başlamak için herhangi bir devlet yoktur. O zaten hep vardır. Eğer kullanırsakTab""<button> şimdi :focus durumuna girer. odaklanmak Senin ardından (veya) tuşuna basınboşluk), daha sonra düğmesine girin (:active) durumuna.

Bir öğenin üzerine tıkladığınızda bu kayda göre, o aynı zamanda :focus :active aynı olduğu yanılsamasını yetiştirerek odak, ver.Bunlar aynı değil.Düğmesine tıklandığında :focus:active durumda.

Bir örnek:

<style type="text/css">
  button { font-weight: normal; color: black; }
  button:focus { color: red; }
  button:active { font-weight: bold; }
</style>

<button>
  When clicked, my text turns red AND bold!<br />
  But not when focused, where my text just turns red
</button>

edit: jsfiddle