Како пливати слику десно од текста

Овај петоминутни туториал објашњава како

Да ли сте заинтересовани да научите како плутати слику десно од текста? Ако јесте, нисте сами. Постоји много ситуација у којима програмери желе да се слика на Веб страници појављује унутар текста са текућим текстом или омотаним око њега. На срећу, манипулисање слика је слично манипулисању текста, па ако имате искуства са другим, овај процес не би требало да буде тешко.

Заправо, са ЦСС флоат својством, лако је плутати вашу слику десно од текста и проћи текст око ње на левој страни . Користите овај петоминутни туторијал како бисте научили како.

Почетак

Да започнете, напишите пасус текста и додајте слику на почетку пасуса. Ово треба урадити прије текста, али након ознаке <п>:

<п> <имг срц = "блвебцам-сампле.јпг" алт = "Суни" /> Дуис је прешао у седам различитих разлога. Купидатат неидентификован, у лабору и долоре магна алкуа. Сунт ин цулпа куис ноструд екерцисе екцептеур синт оццаецат. Моллит аним ид ест лаборум.

Затим додајте атрибу стила слици и примените својство флоат:

<имг срц = "блвебцам-сампле.јпг" алт = "Суни" стиле = "флоат: ригхт;" />

Ваш текст ће бити уперен у односу на слику, па додајте неколико маргина на слику како бисте олакшали читање:

<имг срц = "блвебцам-сампле.јпг" алт = "Суни" стиле = "флоат: ригхт; маргин: 0 5пк 0 0; " />

Робна маржа се односи на маргине у горњој, десној, доњем и левом реду ( ТРБЛ ).

Окончање

И то то ради. Сада видите да плутајућа слика на десно уопште није тешка. Можда ћете такође бити заинтересовани да плутате слику лево и да га пливате у центар. Иако је први потез могуће, на жалост не можете пливати слику у центар, јер би то обично захтевало распоред две колоне.