Kako preletjeti sliku na pravo teksta

Ovaj pet-minutni udžbenik objašnjava kako

Jeste li zainteresirani za učenje plutajuće slike desno od teksta? Ako jeste, niste sami. Postoje mnoge situacije u kojima programeri žele da se slika na web stranici pojavi unutar teksta s tekućim tekstom ili omotavanjem. Srećom, manipuliranje slikama slično je manipuliranju tekstom, pa ako imate iskustva s potonjem, taj proces ne bi trebao biti teško.

Zapravo, sa svojstvom CSS float, lako je plutajte svoju sliku desno od teksta i dotaknite tekst na lijevoj strani . Koristite ovaj pet-minutni udžbenik kako biste saznali kako.

Početak rada

Za početak, zapišite stavak teksta i dodajte sliku na početak odlomka. To bi trebalo biti učinjeno prije teksta, ali nakon oznake

):

Duis aute iure dolor sed do elusmod tempor incididunt u reprehenderit u voluptate. Cupidatat nije proistekao, utjecao je i pažao. Sunt u culpa quis nostrud vježba excepteur sint occaecat. Mollit anim id est laborum.

Zatim dodajte atribut stila na sliku i primijenite svojstvo plutajuće:

style = "float: pravo;" />

Vaš će tekst biti izravnavan na sliku, pa dodajte neke margine na sliku kako biste lakše čitali:

margin: 0 5px 0 0; " />

Stanje kratkog okvira primjenjuje margine u vrhu narudžbe, desno, donju i lijevu ( TRBL ).

Završavati

I to to čini. Sada vidite da plutajući sliku na desnoj strani uopće nije teško. Možda će vas zanima i plutajući sliku lijevo i plutajući je u sredinu. Premda je prvi potez moguće, nažalost ne možete plutati sliku u središte, jer bi to obično trebalo izgled u dva stupca.