Nola mugitu irudi bat testuaren eskuinean

Bost minutuko tutorial honek azaltzen du nola

Irudi baten testua eskuinera nola flotatzen jakin nahi al duzu? Hala bada, ez zara bakarrik. Programatzaileek irudia Web orri batean agertzea nahi duten egoeretan agertuko dira testuan testuan sartutako testuarekin edo inguratzen duten testuarekin. Zorionez, irudiak manipulatzea testua manipulatzeko antzekoa da, beraz, esperientzia dutenekin bat badago, prozesu hau ez da zaila izango.

Izan ere, CSS mugikorreko propietatearekin erraza da zure irudia testuaren eskuinean kokatzea eta testua ezkerreko aldean edukitzea . Erabili hau bost minutuko tutoriala nola ikasten.

Hasten

Hasteko, idatzi testu zati bat eta gehitu irudia paragrafoaren hasieran. Hau testu aurretik egin behar da baina

etiketa ondoren>:

Duela hilabete batzuk pasatzen ari zenean, denbora pixka bat berreskuratzen hasi zen. Cupidatat ez da nahikoa, laborantza eta makineria handitzeko. Arrakasta izan arren, gure ariketa fisikoa baino askoz ere okerragoa da. Mollit anim id est laborum.

Ondoren, estiloaren atributu bat gehitu irudia eta mugikorreko propietatea aplikatu:

style = "float: right;" />

Zure testua irudiarekin zuzenean makurtu egingo da, marjina batzuk gehitzeko irudia errazago irakurtzeko:

margin: 0 5px 0 0; " />

Marjina-taulen propietateak marjinak aplikatzen ditu ordenaren goiko aldean, eskuinean, behealdean eta ezkerrean ( TRBL ).

Itzulbiratu

Eta hori ez da. Orain ikusten duzu eskuineko irudia flotatzen dela ez dela zaila. Irudi bat ezkerretara flotatzen eta zentrora eraman dezakezu. Lehenengo mugimendua posiblea den bitartean, zoritxarrez ezin duzu irudi bat flotatzen erdian, normalean bi zutabeko diseinua beharko luke.