Skip to main content

Com utilitzar CSS per flotar una imatge a la dreta

Taula de continguts:

Anonim

Si estàs interessat a aprendre a flotar una imatge a la dreta del text, estaràs encantat de saber que és una tasca bastant senzilla. Hi ha moltes situacions on els programadors volen que una imatge en una pàgina web aparegui dins del text amb el text que flueix o s'emboliqui al voltant d'ell. Afortunadament, la manipulació d'imatges és similar a la manipulació del text, de manera que si teniu experiència amb aquest últim, aquest procés no ha de ser difícil.

De fet, amb la propietat CSS flotant, és fàcil flotar la vostra imatge a la dreta del text i fer que el text flueixi al voltant del costat esquerre. Utilitzeu aquest tutorial de cinc minuts per aprendre com fer-ho.

Començant

Per començar, escriviu un paràgraf de text i afegiu una imatge al principi del paràgraf. Això s'ha de fer abans del text, però després del

etiqueta):

A continuació, afegiu un atribut d'estil a la imatge i apliqui la propietat flotant:

El vostre text s'enviarà directament a la imatge, així que afegiu alguns marges a la imatge per facilitar la lectura:

Suni

La propietat taquigrafia de marge aplica marges en la part superior, dreta, inferior i esquerra de l'ordre (TRBL).

Embolcall

I això ho fa. Ara veieu que flotar una imatge a la dreta no és difícil. També us pot interessar la flotació d'una imatge cap a l'esquerra i el flotant cap al centre. Tot i que el primer moviment és possible, malauradament, no podeu flotar una imatge al centre, ja que normalment requereixen un disseny en dues columnes.