* počítačové znalosti >> Softvér >> grafický softvér >> .

Čo musíte urobiť, aby ste zmenili inline grafiku plávajúcu grafiku?

Pýtate sa na zmenu toho, ako sa obrázky zobrazujú pri vývoji webových aplikácií. Tu je návod, ako transformovať inline grafiku na plávajúcu grafiku:

Pochopenie rozdielu

* Inline Graphic: Inline grafika sa objaví v toku textu, ako je bežné slovo alebo znak. Považuje sa za súčasť textového obsahu.

* plávajúca grafika: Plávajúca grafika je umiestnená mimo toku textu, čo umožňuje, aby sa okolo neho ovinul text.

Kroky na zmenu inline grafiky na plávajúcu grafiku

1. Pridajte nádobu: Ak váš obrázok nemá prvok kontajnera (napríklad `

`), musíte ho pridať. To poskytuje štruktúru pre štýl plávajúceho správania.

`` `html

`` `

2. Aplikujte CSS: Použite CSS na aplikovanie vlastnosti „float` na váš obrázok alebo jej kontajner.

`` CSS

.image-container {

Float:vľavo; /* alebo float:vpravo; *//

Šírka:200px; / * Upravte šírku podľa potreby */

}

`` `

* `float:vľavo;` Umiestni obrázok doľava, pričom text sa obíha okolo pravej strany.

* `float:right;` Umiestni obrázok doprava, pričom text sa ovinie okolo ľavej strany.

* `Šírka:200px;` Nastavuje šírku obrázka. Nastavte to tak, aby vyhovoval svojmu dizajnu.

Príklad:

`` `html

.image-container {

Float:vľavo;

Šírka:200px;

}

Toto je nejaký text pred obrázkom.

A toto je text po obrázku.

`` `

Ďalšie tipy:

* Vymazať plaváky: Pri používaní plavákov možno budete musieť použiť „Clear:„ oboje; „vlastnosť, aby ste zabránili prúdeniu obsahu okolo plávajúceho prvku.

* Responzívny dizajn: Zvážte použitie dotazov médií na úpravu plávajúceho správania pre rôzne veľkosti obrazovky.

* Alternatívy: Existujú aj ďalšie techniky polohovania obrázkov okrem plávania, ako je absolútne umiestnenie (`pozícia:Absolute`) a Flexbox (` displej:flex`). Vyberte metódu, ktorá najlepšie vyhovuje vašim potrebám dizajnu.

Dajte mi vedieť, či by ste chceli viac podrobností o niektorých z týchto techník!

Predchádzajúca strana: Aký je nejaký softvér na stiahnutie obrázkov?
Ďalšia strana: Dajú sa grafické odpaliská vyrobiť bez počítačov?

Čo musíte urobiť, aby ste zmenili inline grafiku plávajúcu grafiku?

Odporúčané články

Najnovšie články

grafický softvér