[CSS][HTML] Tekst i przyciemnienie na obrazku Opcje

[annow]

Witam, chcę zrobić aby na obrazku po najechaniu pojawił się tekst, przyciemnienie zrobiłem opcją

[HTML] pobierz, plaintext 
.obrazek1:hover {  filter: brightness(30%); }
[HTML] pobierz, plaintext 

a w HTML:

[HTML] pobierz, plaintext 
<img class="obrazek1" src="obrazek1.png" />
[HTML] pobierz, plaintext 

i chcę aby po najechaniu pojawił się tekst, ktoś ma jakieś pomysły?

[trueblue]

Nie ma problemu.
Musisz zastosować jedną z metod, które podałem na początku.
Trzeba jakoś ukryć tekst przed najechaniem.

[annow]

Nie ma problemu.
Musisz zastosować jedną z metod, które podałem na początku.
Trzeba jakoś ukryć tekst przed najechaniem.

Wybrałem metodę z divem, nie ze spanem i próbowałem ukryć i zakryło mi wszystko...

[HTML] pobierz, plaintext 
.test1 {
  position:relative;
  visibility:hidden;
}
.test1:hover {
   -webkit-filter: brightness(30%);
   filter: brightness(30%);
   -webkit-transition: all 1s linear;
   -moz-transition: all 1s linear;
   -ms-transition: all 1s linear;
   -o-transition: all 1s linear;
   transition: all 1s linear;
   font-size: 40px;
}
 
.obra1 {
	position: absolute;
	font-size: 100px;
	font-color: yellow;
  z-index:-1;
}
[HTML] pobierz, plaintext 

oraz

[HTML] pobierz, plaintext 
<div class="test1">
<img class="obra1" src="obrazek1.png" width="200" height="200" />bla bDDDDDdddddddla</div>
[HTML] pobierz, plaintext