mirror of
https://github.com/ONLYOFFICE/web-apps.git
synced 2026-07-26 04:25:06 +08:00
156 lines
18 KiB
HTML
156 lines
18 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<title>Umetanje slika</title>
|
||
<meta charset="utf-8" />
|
||
<meta name="description" content="Dodajte sliku u dokument i prilagodite njen položaj i svojstva" />
|
||
<link type="text/css" rel="stylesheet" href="../../../../../../common/main/resources/help/editor.css" />
|
||
<link type="text/css" rel="stylesheet" href="../../images/sprite.css" />
|
||
<script type="text/javascript" src="../callback.js"></script>
|
||
<script type="text/javascript" src="../../../../../../common/main/resources/help/search/js/page-search.js"></script>
|
||
</head>
|
||
<body>
|
||
<div class="mainpart">
|
||
<div class="search-field">
|
||
<input id="search" class="searchBar" placeholder="Pretraga" type="text" onkeypress="doSearch(event)">
|
||
</div>
|
||
<h1>Umetanje slika</h1>
|
||
<p>U <a href="https://www.onlyoffice.com/document-editor.aspx" target="_blank" onclick="onhyperlinkclick(this)"><b>Document Editor</b></a>-u možete umetati slike u najpopularnijim formatima u dokument. Podržani su sledeći formati slika: <b>BMP</b>, <b>GIF</b>, <b>JPEG</b>, <b>JPG</b>, <b>PNG</b>.</p>
|
||
<h3>Umetanje slike</h3>
|
||
<p>Da biste umetnuli sliku u tekst dokumenta,</p>
|
||
<ol>
|
||
<li>postavite kursor na mesto gde želite da se slika umetne,</li>
|
||
<li>pređite na karticu <b>Insert</b> na gornjoj traci sa alatkama,</li>
|
||
<li>kliknite na ikonu <div class="icon icon-image"></div> <b>Image</b> na gornjoj traci sa alatkama,</li>
|
||
<li>izaberite jednu od sledećih opcija za učitavanje slike:
|
||
<ul>
|
||
<li>opcija <b>Image from File</b> otvoriće standardni dijalog za izbor fajla. Pronađite odgovarajući fajl na hard disku računara i kliknite na dugme <b>Open</b>
|
||
<p class="note">U <em>onlajn editoru</em> možete izabrati više slika odjednom.</p>
|
||
</li>
|
||
<li>opcija <b>Image from URL</b> otvoriće prozor u koji možete uneti veb adresu željene slike i kliknuti na dugme <b>OK</b></li>
|
||
<li class="onlineDocumentFeatures">opcija <b>Image from Storage</b> otvoriće prozor <b>Select data source</b>. Izaberite sliku sačuvanu na vašem portalu i kliknite na dugme <b>OK</b></li>
|
||
</ul>
|
||
</li>
|
||
<li>kada se slika doda, možete promeniti njenu veličinu, svojstva i položaj.</li>
|
||
</ol>
|
||
<p>Takođe je moguće dodati natpis slici. Više informacija o radu sa natpisima za slike možete pronaći u <a href="../UsageInstructions/AddCaption.htm" onclick="onhyperlinkclick(this)">ovom članku</a>.</p>
|
||
<h3>Pomeranje i promena veličine slika</h3>
|
||
<p><span class="big big-moving_image"></span></p>
|
||
<p>Da biste promenili veličinu slike, prevucite male kvadrate <span class="icon icon-resize_square"></span> koji se nalaze na njenim ivicama. Da biste zadržali originalne proporcije izabrane slike prilikom promene veličine, držite pritisnut taster <b>Shift</b> i prevucite jednu od ugaonih ikona.</p>
|
||
<p>Da biste promenili položaj slike, koristite ikonu <span class="icon icon-arrow"></span> koja se pojavljuje kada pređete kursorom miša preko slike. Prevucite sliku na željenu poziciju bez puštanja tastera miša.</p>
|
||
<p>Prilikom pomeranja slike, prikazuju se pomoćne linije koje vam pomažu da precizno pozicionirate objekat na stranici (ukoliko izabrani stil prelamanja nije „inline“).</p>
|
||
<p>Da biste rotirali sliku, postavite kursor miša iznad ručice za rotaciju <span class="icon icon-greencircle"></span> i prevucite je u smeru ili suprotno od smera kazaljke na satu. Da biste ograničili ugao rotacije na korake od 15 stepeni, držite pritisnut taster <b>Shift</b> tokom rotacije.</p>
|
||
<p class="note">
|
||
<b>Napomena</b>: lista prečica sa tastature koje se mogu koristiti prilikom rada sa objektima dostupna je <a href="../HelpfulHints/KeyboardShortcuts.htm#workwithobjects" onclick="onhyperlinkclick(this)">ovde</a>.
|
||
</p>
|
||
<hr />
|
||
<h3>Podešavanje svojstava slike</h3>
|
||
<p><img alt="Kartica Image Settings" src="../images/right_image.png" /></p>
|
||
<p>Neka svojstva slike mogu se promeniti pomoću kartice <b>Image settings</b> na desnoj bočnoj traci. Da biste je aktivirali, kliknite na sliku i izaberite ikonu <b>Image settings</b> <span class="icon icon-image_settings_icon"></span> sa desne strane. Ovde možete promeniti sledeća svojstva:</p>
|
||
<ul>
|
||
<li>
|
||
<b>Size</b> se koristi za prikaz <b>Width</b> i <b>Height</b> trenutne slike. Ako je potrebno, možete vratiti stvarnu veličinu slike klikom na dugme <b>Actual Size</b>. Dugme <b>Fit to Margin</b> omogućava promenu veličine slike tako da zauzme sav prostor između leve i desne margine stranice.
|
||
<p>Dugme <b>Crop</b> koristi se za isecanje slike. Kliknite na dugme <b>Crop</b> da biste aktivirali ručice za isecanje koje se pojavljuju na uglovima slike i u centru svake njene ivice. Ručno prevucite ručice da biste definisali oblast isecanja. Možete pomeriti kursor miša preko ivice oblasti isecanja dok se ne pretvori u ikonu <span class="icon icon-arrow"></span> i prevući oblast.</p>
|
||
<ul>
|
||
<li>Da biste isekli jednu stranu, prevucite ručicu koja se nalazi u centru te strane.</li>
|
||
<li>Da biste istovremeno isekli dve susedne strane, prevucite jednu od ugaonih ručica.</li>
|
||
<li>Da biste jednako isekli dve suprotne strane slike, držite pritisnut taster <em>Ctrl</em> dok prevlačite ručicu u centru jedne od tih strana.</li>
|
||
<li>Da biste jednako isekli sve strane slike, držite pritisnut taster <em>Ctrl</em> dok prevlačite bilo koju od ugaonih ručica.</li>
|
||
</ul>
|
||
<p>Kada je oblast isecanja definisana, kliknite ponovo na dugme <b>Crop</b>, ili pritisnite taster <em>Esc</em>, ili kliknite bilo gde van oblasti isecanja da biste primenili izmene.</p>
|
||
<p>Nakon izbora oblasti isecanja, moguće je koristiti i opcije <b>Crop to shape</b>, <b>Fill</b> i <b>Fit</b> koje su dostupne u padajućem meniju <b>Crop</b>. Kliknite ponovo na dugme <b>Crop</b> i izaberite željenu opciju:</p>
|
||
<ul>
|
||
<li>Ako izaberete opciju <b>Crop to shape</b>, slika će popuniti određeni oblik. Možete izabrati oblik iz galerije koja se otvara kada zadržite pokazivač miša iznad opcije <b>Crop to Shape</b>. I dalje možete koristiti opcije <b>Fill</b> i <b>Fit</b> da biste izabrali način na koji se slika uklapa u oblik.</li>
|
||
<li>Ako izaberete opciju <b>Fill</b>, centralni deo originalne slike biće sačuvan i korišćen za popunjavanje izabrane oblasti isecanja, dok će ostali delovi slike biti uklonjeni.</li>
|
||
<li>Ako izaberete opciju <b>Fit</b>, slika će biti prilagođena tako da odgovara visini i širini oblasti isecanja. Nijedan deo originalne slike neće biti uklonjen, ali se mogu pojaviti prazni prostori unutar izabrane oblasti isecanja.</li>
|
||
</ul>
|
||
<p>Da biste vratili sliku na podrazumevane dimenzije u pikselima, kliknite na dugme <b>Reset crop</b>.</p>
|
||
</li>
|
||
<li><b>Opacity</b> – koristi se za podešavanje nivoa <b>neprovidnosti</b> pomeranjem klizača ili ručnim unosom procentualne vrednosti. Podrazumevana vrednost je <b>100%</b> i odgovara punoj neprovidnosti. Vrednost <b>0%</b> odgovara potpunoj providnosti.</li>
|
||
<li>
|
||
<b>Rotation</b> se koristi za rotaciju slike za 90 stepeni u smeru ili suprotno od smera kazaljke na satu, kao i za horizontalno ili vertikalno okretanje slike. Kliknite na jedno od sledećih dugmadi:
|
||
<ul>
|
||
<li><div class="icon icon-rotatecounterclockwise"></div> za rotaciju slike za 90 stepeni suprotno od smera kazaljke na satu</li>
|
||
<li><div class="icon icon-rotateclockwise"></div> za rotaciju slike za 90 stepeni u smeru kazaljke na satu</li>
|
||
<li><div class="icon icon-fliplefttoright"></div> za horizontalno okretanje slike (sleva nadesno)</li>
|
||
<li><div class="icon icon-flipupsidedown"></div> za vertikalno okretanje slike (odozgo nadole)</li>
|
||
</ul>
|
||
</li>
|
||
<li><b>Stil prelamanja</b> se koristi za izbor stila prelamanja teksta iz dostupnih opcija - u redu (inline), kvadratno (square), tesno (tight), kroz (through), gore i dole (top and bottom), ispred (in front), iza (behind) (za više informacija pogledajte opis naprednih podešavanja ispod).</li>
|
||
<li><b>Zameni sliku</b> se koristi za zamenu trenutne slike učitavanjem druge <b>Iz fajla</b>, <b>Iz skladišta</b> ili <b>Sa URL-a</b>.</li>
|
||
</ul>
|
||
<p>Neke od ovih opcija možete pronaći i u <b>meniju desnog klika</b>. Opcije menija su:</p>
|
||
<ul>
|
||
<li><b>Iseci, Kopiraj, Nalepi</b> - standardne opcije koje se koriste za isecanje ili kopiranje izabranog teksta/objekta i lepljenje prethodno isečenog/kopiranog teksta ili objekta na trenutnu poziciju kursora.</li>
|
||
<li><b>Rasporedi</b> se koristi za dovođenje izabrane slike u prvi plan, slanje u pozadinu, pomeranje napred ili nazad, kao i grupisanje ili razgrupisavanje slika radi rada sa više njih odjednom. Da biste saznali više o raspoređivanju objekata, pogledajte <a href="../UsageInstructions/AlignArrangeObjects.htm" onclick="onhyperlinkclick(this)">ovu stranicu</a>.</li>
|
||
<li><b>Poravnaj</b> se koristi za poravnanje slike levo, na sredinu, desno, gore, po sredini ili dole. Da biste saznali više o poravnanju objekata, pogledajte <a href="../UsageInstructions/AlignArrangeObjects.htm" onclick="onhyperlinkclick(this)">ovu stranicu</a>.</li>
|
||
<li><b>Stil prelamanja</b> se koristi za izbor stila prelamanja teksta iz dostupnih opcija - u redu (inline), kvadratno (square), tesno (tight), kroz (through), gore i dole (top and bottom), ispred (in front), iza (behind) - ili za uređivanje granice prelamanja. Opcija <b>Uredi granicu prelamanja</b> dostupna je samo ako izabrani stil prelamanja nije u redu (inline). Prevucite tačke prelamanja da biste prilagodili granicu. Da biste napravili novu tačku prelamanja, kliknite bilo gde na crvenu liniju i prevucite je na željenu poziciju. <div class="big big-wrap_boundary"></div></li>
|
||
<li><b>Rotiraj</b> se koristi za rotaciju slike za 90 stepeni u smeru ili suprotno od smera kazaljke na satu, kao i za horizontalno ili vertikalno okretanje slike.</li>
|
||
<li><b>Sačuvaj kao sliku</b> se koristi za čuvanje slike kao slike na vaš hard disk.</li>
|
||
<li><b>Iseci</b> se koristi za primenu jedne od opcija isecanja: <b>Iseci</b>, <b>Popuni</b> ili <b>Uklopi</b>. Izaberite opciju <b>Iseci</b> iz podmenija, zatim prevucite ručice za isecanje da biste definisali oblast isecanja i ponovo izaberite jednu od ove tri opcije iz podmenija da biste primenili izmene.</li>
|
||
<li><b>Stvarna veličina</b> se koristi za promenu trenutne veličine slike na stvarnu.</li>
|
||
<li><b>Zameni sliku</b> se koristi za zamenu trenutne slike učitavanjem druge <b>Iz fajla</b> ili <b>Sa URL-a</b>.</li>
|
||
<li><b>Napredna podešavanja slike</b> se koristi za otvaranje prozora „Image - Advanced Settings“.</li>
|
||
</ul>
|
||
<p><img alt="Kartica Shape Settings" src="../images/right_image_shape.png" /></p>
|
||
<p>Kada je slika izabrana, ikona <b>Podešavanja oblika</b> <span class = "icon icon-shape_settings_icon"></span> je takođe dostupna sa desne strane. Možete kliknuti na ovu ikonu da biste otvorili karticu <b>Podešavanja oblika</b> na desnoj bočnoj traci i podesili tip, veličinu, boju i neprovidnost <a href="../UsageInstructions/InsertAutoshapes.htm#shape_stroke" onclick="onhyperlinkclick(this)"><b>Linije</b></a>, kao i promenili tip oblika izborom drugog oblika iz menija <b>Promeni automatski oblik</b>. Oblik slike će se odgovarajuće promeniti.</p>
|
||
<p>Na kartici <b>Podešavanja oblika</b> možete koristiti i opciju <b>Prikaži senku</b> da biste dodali senku slici.</p>
|
||
<hr />
|
||
<h3>Podešavanje naprednih podešavanja slike</h3>
|
||
<p>Da biste promenili napredna podešavanja slike, kliknite desnim tasterom miša na sliku i izaberite opciju <b>Napredna podešavanja slike</b> iz menija desnog klika ili samo kliknite na link <b>Prikaži napredna podešavanja</b> na desnoj bočnoj traci. Otvoriće se prozor sa svojstvima slike:</p>
|
||
<p><img alt="Image - Advanced Settings: Size" src="../images/image_properties.png" /></p>
|
||
<p>Kartica <b>Veličina</b> sadrži sledeće parametre:</p>
|
||
<ul>
|
||
<li><b>Širina</b> i <b>Visina</b> - koristite ove opcije da promenite širinu i/ili visinu. Ako je kliknuto dugme <b>Stalne proporcije</b> <div class = "icon icon-constantproportions"></div> (u tom slučaju izgleda ovako <div class = "icon icon-constantproportionsactivated"></div>), širina i visina će se menjati zajedno uz očuvanje originalnog odnosa stranica slike. Da biste vratili stvarnu veličinu dodate slike, kliknite na dugme <b>Stvarna veličina</b>.</li>
|
||
</ul>
|
||
<p><img alt="Image - Advanced Settings: Rotation" src="../images/image_properties_4.png" /></p>
|
||
<p>Kartica <b>Rotacija</b> sadrži sledeće parametre:</p>
|
||
<ul>
|
||
<li><b>Ugao</b> - koristite ovu opciju da rotirate sliku za tačno određeni ugao. Unesite potrebnu vrednost u stepenima u polje ili je prilagodite koristeći strelice sa desne strane. </li>
|
||
<li><b>Okrenuto</b> - označite polje <b>Horizontalno</b> da biste okrenuli sliku horizontalno (sleva nadesno) ili označite polje <b>Vertikalno</b> da biste okrenuli sliku vertikalno (naopako).</li>
|
||
</ul>
|
||
<p><img alt="Image - Advanced Settings: Text Wrapping" src="../images/image_properties_1.png" /></p>
|
||
<p>Kartica <b>Prelamanje teksta</b> sadrži sledeće parametre:</p>
|
||
<ul>
|
||
<li><b>Stil prelamanja</b> - koristite ovu opciju da promenite način na koji je slika pozicionirana u odnosu na tekst: ili će biti deo teksta (ako izaberete stil u redu/inline) ili će je tekst obilaziti sa svih strana (ako izaberete jedan od ostalih stilova).
|
||
<ul>
|
||
<li><p><div class = "icon icon-wrappingstyle_inline"></div> <b>U redu</b> - slika se smatra delom teksta, kao znak, pa kada se tekst pomera, slika se pomera zajedno sa njim. U tom slučaju opcije pozicioniranja nisu dostupne.</p>
|
||
<p>Ako je izabran jedan od sledećih stilova, sliku možete pomerati nezavisno od teksta i precizno je pozicionirati na stranici:</p>
|
||
</li>
|
||
<li><p><div class = "icon icon-wrappingstyle_square"></div> <b>Kvadratno</b> - tekst se prelama oko pravougaonog okvira koji ograničava sliku.</p></li>
|
||
<li><p><div class = "icon icon-wrappingstyle_tight"></div> <b>Tesno</b> - tekst se prelama oko stvarnih ivica slike.</p></li>
|
||
<li><p><div class = "icon icon-wrappingstyle_through"></div> <b>Kroz</b> - tekst se prelama oko ivica slike i popunjava otvoreni beli prostor unutar slike. Da bi se efekat pojavio, koristite opciju <b>Uredi granicu prelamanja</b> iz menija desnog klika.</p></li>
|
||
<li><p><div class = "icon icon-wrappingstyle_topandbottom"></div> <b>Gore i dole</b> - tekst je samo iznad i ispod slike.</p></li>
|
||
<li><p><div class = "icon icon-wrappingstyle_infront"></div> <b>Ispred</b> - slika prekriva tekst.</p></li>
|
||
<li><p><div class = "icon icon-wrappingstyle_behind"></div> <b>Iza</b> - tekst prekriva sliku.</p></li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
<p>Ako izaberete stil kvadratno, tesno, kroz ili gore i dole, moći ćete da podesite dodatne parametre - <b>udaljenost od teksta</b> sa svih strana (gore, dole, levo, desno).</p>
|
||
<p id="position"><img alt="Image - Advanced Settings: Position" src="../images/image_properties_2.png" /></p>
|
||
<p>Kartica <b>Pozicija</b> je dostupna samo ako izaberete stil prelamanja različit od u redu (inline). Ova kartica sadrži sledeće parametre koji se razlikuju u zavisnosti od izabranog stila prelamanja:</p>
|
||
<ul>
|
||
<li>
|
||
Odeljak <b>Horizontalno</b> omogućava izbor jednog od sledeća tri tipa pozicioniranja slike:
|
||
<ul>
|
||
<li><b>Poravnanje</b> (levo, centar, desno) <b>u odnosu na</b> znak, kolonu, levu marginu, marginu, stranicu ili desnu marginu,</li>
|
||
<li>Apsolutna <b>Pozicija</b> merena u apsolutnim jedinicama tj. <b>centimetrima</b>/<b>tačkama</b>/<b>inčima</b> (u zavisnosti od opcije podešene na kartici <b>File</b> -> <b>Advanced Settings...</b>) <b>udesno od</b> znaka, kolone, leve margine, margine, stranice ili desne margine,</li>
|
||
<li><b>Relativna pozicija</b> merena u procentima <b>u odnosu na</b> levu marginu, marginu, stranicu ili desnu marginu.</li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
Odeljak <b>Vertikalno</b> omogućava izbor jednog od sledeća tri tipa pozicioniranja slike:
|
||
<ul>
|
||
<li><b>Poravnanje</b> (gore, centar, dole) <b>u odnosu na</b> liniju, marginu, donju marginu, pasus, stranicu ili gornju marginu,</li>
|
||
<li>Apsolutna <b>Pozicija</b> merena u apsolutnim jedinicama tj. <b>centimetrima</b>/<b>tačkama</b>/<b>inčima</b> (u zavisnosti od opcije podešene na kartici <b>File</b> -> <b>Advanced Settings...</b>) <b>ispod</b> linije, margine, donje margine, pasusa, stranice ili gornje margine,</li>
|
||
<li><b>Relativna pozicija</b> merena u procentima <b>u odnosu na</b> marginu, donju marginu, stranicu ili gornju marginu.</li>
|
||
</ul>
|
||
</li>
|
||
<li><b>Pomeri objekat sa tekstom</b> obezbeđuje da se slika pomera zajedno sa tekstom za koji je usidrena.</li>
|
||
<li><b>Dozvoli preklapanje</b> omogućava da se dve slike preklapaju ako ih prevučete blizu jedna drugoj na stranici.</li>
|
||
</ul>
|
||
<p><img alt="Image - Advanced Settings" src="../images/image_properties_3.png" /></p>
|
||
<p>Kartica <b>Alternativni tekst</b> omogućava da se unesu <b>Naslov</b> i <b>Opis</b> koji će biti pročitani osobama sa oštećenjem vida ili kognitivnim poteškoćama kako bi bolje razumele koje informacije slika sadrži.</p>
|
||
</div>
|
||
</body>
|
||
</html> |