Przyciemnienie części zdjęcia

Question

Witam, chciałbym przyciemnić tylko część zdjęcia i na nim napisać tytuł newsa. Obecnie wyświeltam to w ten sposób:

<div style="position:relative;">
<img src="images/'.$rows['image'].'" alt="'.$rows['title'].'">
<div style="position:absolute;right:0px;left:0px;bottom:0px;background-color: black">
<h2>'.$rows['title'].'</h2>
</div>
</div>

Nie wygląda to zbyt pięknie wolałbym by zamiast czarnego tła, zdjęcie było w tym prostokącie przyciemnione. Próbowałem z opacity ale nie mam pojęcia jak ustawić to tylko dla kawałka zdjęcia

 

Answer 1

Zamiast koloru `black` użyj `rgba(0, 0, 0, 0.7)` gdzie ostatnia liczba oznacza przezroczystość koloru od 0 do 1 a pozostałe to opis koloru jako składowe Red, Green, Blue (o wartościach od 0 do 255)

---

Przy okazji: do zadawania styli użyj plik CSS to będzie czytelniejszy HTML i będzie łatwiej zadawać te same właściwości dla wielu elementów.

Comments

To było takie proste... :)

Napisałem taki kod by łatwiej było Wam go przeczytać

Dzięki wielkie !!

---

Jakbyś wkleił html i css osobno - nie było by problemu z rozczytaniem tego :)