Kaip apvynioti tekstą aplink paveikslą naudojant HTML arba CSS

Įvadas

Kai į svetainės puslapį įdedate paveikslą kartu su tekstu, numatytasis stilius dažniausiai rodo paveikslą virš arba po tekstu, palikdamas tuščią vietą kairėje ir dešinėje. Tai švaisto vietą ir sukelia įspūdį, kad paveikslas nesusijęs su turiniu. Naudodami HTML arba CSS galite nurodyti, kad tekstas apvyniotų paveikslą.

HTML metodas

1 žingsnis

Atidarykite HTML failą teksto redaktoriuje ir įterpkite <img> žymą. Po žymos src pridėkite atributą align su kabutėmis, pvz.:

<img src=\"paveiksle.jpg\" align=\"right\">

2 žingsnis

„align“ atributo reikšmė gali būti right, left, top, middle arba bottom.

• right – tekstas išsidės kairėje nuo paveikslo;
• left – tekstas išsidės dešinėje nuo paveikslo;
• top – tekstas prasidės paveikslo viršuje;
• middle – tekstas bus lygiuojamas į vidurį;
• bottom – tekstas prasidės paveikslo apačioje.

Išsaugokite failą.

CSS metodas

1 žingsnis

Į <img> žymą įterpkite atributą style ir atsidarykite kabutes prieš uždaromąjį žymos kampą:

<img src=\"paveiksle.jpg\" style=\"float: right;\">

2 žingsnis

„float“ savybės reikšmė gali būti left arba right.

• left – paveikslas pasirodys kairėje, o tekstas dešinėje;
• right – paveikslas pasirodys dešinėje, o tekstas kairėje.

Išsaugokite failą.

URL:https://lt.whycomputer.com/software/100404875.html