Cum se face text pe un fundal transparent

Acasă - CSS - Cum se face text pe un fundal transparent

Cum se face text pe un fundal transparent

Bună seara, prieteni. Vreau să vă reamintesc că am studiat anterior proprietatea de opacitate. cu ajutorul căruia a fost stabilită transparența elementelor. Dar pentru această proprietate nu vom putea să implementăm, de exemplu, o astfel de sarcină: să facem textul pe un fundal transparent. Ca exemplu în lecția de astăzi, realizăm această sarcină. Pentru a rezolva această problemă, avem nevoie de fondul de proprietate css. Acesta oferă posibilitatea de a seta culoarea de fundal în format RGB. precum și rgba. Dacă nu știți, atunci r este responsabil pentru componenta roșie, g este verde, b este albastru. Și a este responsabil pentru canalul alfa. cu care puteți seta transparența. Ie va fi suficient pentru noi să specificăm aceste valori și ne vom realiza sarcina. Să începem de exemplu.



Fundal translucid cu text




Text cu fundal transparent





Rămâne să scrieți câteva linii de stiluri CSS și totul va fi gata.

bloc <
fundal. rgba (100, 50, 70, 0,1);
înălțime. 100px;
lățime. 250px;
>

Totul, realizarea sarcinii noastre este finalizată. După cum puteți vedea, am creat blocul introducând în el un paragraf cu textul.
Cu ajutorul stilurilor stabilite pentru o lățime și o înălțime fixă, aliniați textul în centrul blocului și setați proprietatea fondului. în care a fost specificat canalul alfa și datorită acestui text textul a rămas opac, spre deosebire de cazul în care am folosit proprietatea de opacitate pentru blocul nostru.
Iată o lecție suficient de scurtă pentru noi, dar am realizat o sarcină destul de populară. Pe asta îți spun la revedere, te văd.

5 ultimile articole recente:

Cum se face text pe un fundal transparent

Cum se face text pe un fundal transparent

Buna ziua dragi prieteni, astazi vom studia un alt subiect dedicat limbajului CSS. Și să învețe cum să implementeze sfaturi în CSS.

Cum se face text pe un fundal transparent

Astăzi, vom examina o altă opțiune pe care o oferă CSS3, și anume, țintă de pseudo-clasă. pentru care am putea avea nevoie de ea, și ia în considerare una dintre cele mai populare moduri de utilizare a acesteia.

Cum se face text pe un fundal transparent

Articole similare