Ako plávať obrázok napravo od textu

Tento päťminútový návod vysvetľuje, ako

Máte záujem učiť sa, ako plávať obrázok napravo od textu? Ak áno, nie ste sami. Existuje veľa situácií, kedy programátori chcú, aby sa obrázok na webovej stránke objavil vo vnútri textu s textom, ktorý tečie alebo sa obklopuje. Našťastie, manipulácia s obrázkami je podobná manipulácii s textom, takže ak máte skúsenosti s týmto druhom, tento proces by nemal byť ťažký.

V skutočnosti, s CSS float nehnuteľnosť, je ľahké plávať váš obrázok napravo od textu a majú text toku okolo to na ľavej strane . Použite tento päťminútový tutoriál a zistite, ako.

Začíname

Ak chcete začať, napíšte odsek textu a pridajte obrázok na začiatok odseku. Toto by sa malo vykonať pred textom, ale po značke

:

Dôležitá je, aby sa zabránilo dočasnému poškodeniu. Nespoločenský prezident, pracujúci a dravý magna aliqua. Chystám sa v cvičení s výnimkou výnimočného santa occaecat. Molitové zvieratá sú laboratórne.

Ďalej pridajte atribút štýlu do obrázku a použite vlastnosť float:

style = "float: right;" />

Váš text bude vpichnutý hore proti obrázku, preto pridajte do obrázka niekoľko okrajov, aby ste ho ľahšie čítali:

margin: 0 5px 0 0 "

Vlastnosť okrajovej rezervy používa okraje v hornom, pravom, dolnom a ľavom poradí ( TRBL ).

Zbaliť

A to robí. Teraz vidíte, že plávajúci obraz napravo nie je vôbec ťažký. Tiež by vás mohlo zaujímať, či chcete obrázok posunúť doľava a plávať do stredu. Ak je prvý krok možný, bohužiaľ nemôžete plaviť do stredu, pretože by to zvyčajne vyžadovalo rozloženie v dvoch stĺpcoch.