CSS izgled zahtijeva da razmišljate o svom izgledu web stranice u cjelini, a potom uzmite komade i stavite ih zajedno. Saznajte kako izraditi jednostavan izgled s 3 stupca s CSS-om.
01 od 09
Izvuci svoj izgled J Kyrnin Možete nacrtati svoj izgled na papiru ili u grafičkom programu . Ako već imate na umu žičani okvir ili još opsežniji dizajn, pojednostavite ga u osnovnim okvirima koji čine web mjesto. Ovaj dizajn koji prati ovaj članak ima tri stupca u glavnom području sadržaja, kao i zaglavlje i podnožje. Ako pomno pogledate, možete vidjeti da tri stupca nisu jednaka širini.
Nakon što izvučete svoj izgled, možete početi razmišljati o dimenzijama. Ovaj primjer dizajna ima sljedeće osnovne dimenzije:
Ne širi više od 900 piksela 20 px žlijeb na lijevoj strani 10 px između stupaca i redaka Stupci koji su široki 250px, 300px i 300px Najveći redak je 150 px visok Donji redak je 100 px visok 02 od 09
Napišite osnovne HTML / CSS i stvorite spremnik Budući da će ova stranica biti važeći HTML dokument, započnite s praznim HTML spremnikom
Untitled Document < title> </ head> <body> </ body> </ html> <p> Dodajte osnovne CSS stilove da biste <a href="https://hr.eyewated.com/upotrijebite-css-na-zero-out-your-margins-and-borders/">izbrisali margine stranice, granice i paddings</a> . Iako postoje drugi <a href="https://hr.eyewated.com/upoznajte-cascading-style-sheets-s-ovim-css-cheat-listom/">standardni CSS stilovi</a> za nove dokumente, ti su stilovi minimalni koji trebate dobiti čist izgled. Dodajte ih na glavu dokumenta: </p>
<style type = "text / css"> html, tijelo {margina: 0px; padding: 0px; granica: 0px; } </ style> <p> Da biste započeli s izgradnjom izgleda, stavite element spremnika. Ponekad se dogodi da se kasnije možete riješiti kontejnera, no za većinu izgleda s fiksnom širinom, element spremnika olakšava upravljanje različitim web-preglednicima. Tako je u tijelu ovo stavio: </p>
<div id = "spremnik"> </ div> <p> I na CSS stilu, stavite: </p>
#container {} <p> <strong>03 od 09</strong> </p>
<h3> Uređaj kontejnera </h3><p> Spremnik određuje koliko će biti širok sadržaj web stranice, kao i margine oko vanjske strane i padding iznutra. Za ovaj dokument spremnik je širok 870 piksela s lijevom žlijebom od 20 piksela. Žlijeb je postavljen stilom margina, ali je ispuna na spremniku nula s vanjske strane kako bi se spriječilo da bilo koji element bude širok poput spremnika. </p>
#container {width: 870px; margina: 0 0 0 20px; / * gornji desni dno lijevo / padding: 0; } <p> Ako spremite dokument, bit će teško vidjeti spremnik jer nema ništa u njemu. Ako dodate tekst rezerviranog mjesta, jasnije ćete vidjeti element spremnika. </p>
<p> <strong>04 od 09</strong> </p>
<h3> Upotrijebite oznaku naslova za zaglavlje </h3><p> Kako se odlučite za stil redak zaglavlja ovisi puno o tome što je u njemu. Ako redak zaglavlja jednostavno ima logotip i naslov, tada upotreba naslovne oznake (<h1>) ima više smisla nego upotreba <div>. Možete oblikovati naslov na isti način na koji oblikite div i izbjegavate neobične oznake. </p>
<p> HTML za zaglavlje zaglavlje ide na vrh spremnika i izgleda ovako: </p>
<h1> Moj redak zaglavlja </ h1> <p> Zatim, da biste postavili stilove na njemu, na dnu je dodana crvena granica da biste vidjeli gdje završava, margine i padding su nulte ispisane, širina postavljena na 100% i visina do 150px: </p>
#container h1 {margin: 0; padding: 0; širina: 100%; visina: 150px; plutaju: lijevo; granični dno: # c00 solid 3px; } <p> Ne zaboravite plutajte ovaj element s plovkom: lijevo; nekretnine. Ključ za pisanje CSS izgleda je da pluta sve - čak i stvari koje su iste širine kao kontejner. Na taj način, uvijek znate gdje će elementi ležati na stranici. </p>
<p> Odabir <a href="https://hr.eyewated.com/sto-je-odabir-css-descendanta/">selektora CSS</a> primijenio se samo na elemente H1 koji su unutar #container elementa. </p>
<p> <strong>05 od 09</strong> </p>
<h3> Da biste dobili tri stupca, počnite graditi dva stupca </h3><p> Kada izradite izgled u tri stupca s CSS-om, morate podijeliti svoj izgled u dvije skupine. Dakle, za ovaj izgled u tri stupca, srednji i desni stupac i grupirani pored lijevog stupca u rasporedu s dva stupca gdje je lijevi stupac širok 250 px, a desni stupac širok 610 piksela (300 za dva stupca , plus 10 piksela za kanal između njih). </p>
<p> HTML izgleda ovako: </p>
<div id = "col1"> <p> Utvrđivanje ovog projekta je vrlo korisno. Smanjite veličinu dojke, dodajte minimalnu veličinu, a zatim kliknite na gumb. U reprehenderit u voluptate quis nostrud vježba eu fugiat nulla pariatur. </ P> </ div> <div> </ div> <div> </ div> </ div> </ div> </ div> </ div> </ div> </ div> </ div> </ div> </ div> <div> Ut labore et dolore magna aliqua. Svakako, to je bitno za ubojstvo. </ P> </ div> <p> Tekst mjesta rezerviranja u stupcima čini ih vidljivijima tijekom testiranja. CSS izgleda ovako: </p>
#container # col1 {width: 250px; plutaju: lijevo; } #container # col2outer {width: 610px; plutajuće: pravo; margina: 0; padding: 0; } <p> Kolona s lijeve strane plutaju se lijevo, dok je drugo plutao udesno. Budući da je ukupna širina oba stupca 860px, postoji između 10px žlijeba. </p>
<p> <strong>06 od 09</strong> </p>
<h3> Dodajte dva stupca unutar širokog drugog stupca </h3><p> Da biste izradili tri stupca, dodajte dva diva u širi drugi stupac, baš kao što ste dodali 2 diva unutar stupca spremnika u posljednjem koraku. HTML izgleda ovako: </p>
<div id = "col2outer"> <div id = "col2mid"> <p> Utmnite minimalno veniam, a ne samo u ovom trenutku, nego i na istom mjestu. Ut labore et dolore magna aliqua. </ P> </ div> <div id = "col2side"> <amp-img src = "http://hr.wikisource.org/wiki/Posebno:PovezaneNeminacije" Ullam corporis suscipit laboriosam, magnam aliquam quaerat voluptatem. </ P></amp-img> </ div> <div> </ div> </ div> </ div> </ div> <p> A CSS izgleda ovako: </p>
# col2outer # col2mid {width: 300px; plutaju: lijevo; } # col2outer # col2side {width: 300px; plutajuće: pravo; } <p> Budući da se ta dva 300px široka okvira nalaze unutar širokog okvira od 610px, između njih će opet biti 10px kanal. </p>
<p> <strong>07 od 09</strong> </p>
<h3> Dodaj u Footer </h3><p> Sada kada je ostatak stranice oblikovan, možete dodati podnožje. Koristite posljednji div s id "podnožje" i dodajte sadržaj kako biste ga mogli vidjeti. Na vrhu možete dodati i granicu, tako da ćete znati gdje počinje. </p>
<p> HTML: </p>
<div id = "footer"> <p> Autorska prava © 2017 </ p> </ div> <p> CSS: </p>
#container #footer {float: lijevo; širina: 870px; granični vrh: # c00 solid 3px; } <p> <strong>08 od 09</strong> </p>
<h3> Dodajte u svoje osobne stilove i sadržaj </h3><p> Sada kada ste dovršili izgled, možete početi dodavati svoje osobne stilove i sadržaj. Imajte na umu da su granice na zaglavlju i podnožju dodane za prikaz dijelova rasporeda, a ne posebno za dizajn. </p>
<p> <strong>09 od 09</strong> </p>
<h3> Konačni HTML / CSS </h3><p> Evo cjelokupnog dokumenta, HTML-a i CSS-a: </p>
<! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Prijelazni // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns = "http : //www.w3.org/1999/xhtml "> <head> <meta http-equiv =" Sadržaj "content =" text / html; charset = utf-8 "/> <title> Untitled Document < title> <style type = "tekst / css"> html, tijelo {margina: 0px; padding: 0px; granica: 0px; } #container {width: 870px; margina: 0 0 0 20px; / * gornji desni dno lijevo / padding: 0; boja pozadine: #fff; } #container h1 {margin: 0; padding: 0; širina: 100%; visina: 150px; plutaju: lijevo; granični dno: # c00 solid 3px; } #container # col1 {width: 250px; plutaju: lijevo; } #container # col2outer {width: 610px; plutajuće: pravo; margina: 0; padding: 0; } # col2outer # col2mid {width: 300px; plutaju: lijevo; } # col2outer # col2side {width: 300px; plutajuće: pravo; } #container #footer {float: lijevo; širina: 870px; granični vrh: # c00 solid 3px; } </ h1> <div id = "col1"> <p> </ div> <div id = "col1"> </ h1> <h1> <div id = "container" <p> <p> <b> </ div> <div id = "col2mid"> <p> Nam slobodno tempore. </ P> </ div> </ div> <div id = "footer"> <p> Copyright © 2008 </ div> </ div> </ body>
</div>
<div class="amp-related-wrapper">
<h2>Alike posts</h2>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/razumijevanje-3-vrste-css-stilova/">
<amp-img src="https://exse.eyewated.com/pict/4623841739de33b0-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/razumijevanje-3-vrste-css-stilova/">Razumijevanje 3 vrste CSS stilova</a></h3>
<div class="amp-related-meta">
Web dizajn i razvoj </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/odredjivanje-serije-obiteljskih-slova-s-%E2%80%8B%E2%80%8Bcss-font-family-property/">
<amp-img src="https://exse.eyewated.com/pict/9b8c9c144434372d-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/odredjivanje-serije-obiteljskih-slova-s-%E2%80%8B%E2%80%8Bcss-font-family-property/">Određivanje serije obiteljskih slova s CSS Font-Family Property</a></h3>
<div class="amp-related-meta">
Web dizajn i razvoj </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/grupiranje-vise-css-odabira/">
<amp-img src="https://exse.eyewated.com/pict/fa929f827af430e8-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/grupiranje-vise-css-odabira/">Grupiranje više CSS odabira</a></h3>
<div class="amp-related-meta">
Web dizajn i razvoj </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/kako-promijeniti-font-na-web-stranicama-pomocu-css-a/">
<amp-img src="https://exse.eyewated.com/pict/2290be1f74fa346f-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/kako-promijeniti-font-na-web-stranicama-pomocu-css-a/">Kako promijeniti font na web stranicama pomoću CSS-a</a></h3>
<div class="amp-related-meta">
Web dizajn i razvoj </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/stiliranje-xml-dokumenata-s-css-om/">
<amp-img src="https://exse.eyewated.com/pict/2445473108f83557-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/stiliranje-xml-dokumenata-s-css-om/">Stiliranje XML dokumenata s CSS-om</a></h3>
<div class="amp-related-meta">
Web dizajn i razvoj </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/koja-je-razlika-izmedju-import-i-veze-za-css/">
<amp-img src="https://exse.eyewated.com/pict/e1ef7baeb7f72ff1-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/koja-je-razlika-izmedju-import-i-veze-za-css/">Koja je razlika između @import i veze za CSS?</a></h3>
<div class="amp-related-meta">
Web dizajn i razvoj </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/5-razloga-za-ucenje-css-a/">
<amp-img src="https://exse.eyewated.com/pict/26de6cfb03fb32d6-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/5-razloga-za-ucenje-css-a/">5 razloga za učenje CSS-a</a></h3>
<div class="amp-related-meta">
Web dizajn i razvoj </div>
</div>
</div>
<div class="amp-related-content">
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/cesto-postavljana-pitanja-o-web-dizajnu-html-css-i-web-razvoju/">Često postavljana pitanja o web dizajnu, HTML, CSS i web razvoju</a></h3>
<div class="amp-related-meta">
Web dizajn i razvoj </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/kako-uvesti-odlomke-sa-css-om/">
<amp-img src="https://exse.eyewated.com/pict/a7fe27e18190322c-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/kako-uvesti-odlomke-sa-css-om/">Kako uvesti odlomke sa CSS-om</a></h3>
<div class="amp-related-meta">
Web dizajn i razvoj </div>
</div>
</div>
</div>
<div class="amp-related-wrapper">
<h2>See Newest</h2>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/belarc-savjetnik-v8-6b/">
<amp-img src="https://exse.eyewated.com/pict/a1e9b9e81a78339d-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/belarc-savjetnik-v8-6b/">Belarc savjetnik v8.6b</a></h3>
<div class="amp-related-meta">
Softver i aplikacije </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/vizio-e420i-smart-led-lcd-tv-fotografije/">
<amp-img src="https://exse.eyewated.com/pict/8a1c7611938c36db-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/vizio-e420i-smart-led-lcd-tv-fotografije/">Vizio E420i Smart LED / LCD TV - Fotografije</a></h3>
<div class="amp-related-meta">
Recenzije proizvoda </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/androidov-program-za-obradu-teksta-za-vas-telefon-ili-tablet/">
<amp-img src="https://exse.eyewated.com/pict/0b5fba849e9e3592-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/androidov-program-za-obradu-teksta-za-vas-telefon-ili-tablet/">Androidov program za obradu teksta za vaš telefon ili tablet</a></h3>
<div class="amp-related-meta">
Softver </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/sto-je-izdavanje-imovine/">
<amp-img src="https://exse.eyewated.com/pict/4065e468751534ea-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/sto-je-izdavanje-imovine/">Što je izdavanje imovine?</a></h3>
<div class="amp-related-meta">
Softver </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/photoshop-kako-koristeci-spin-blur/">
<amp-img src="https://exse.eyewated.com/pict/7694d490d6cd30c8-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/photoshop-kako-koristeci-spin-blur/">Photoshop Kako: Koristeći Spin Blur</a></h3>
<div class="amp-related-meta">
Softver </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/sto-je-pfitznerova-metoda/">
<amp-img src="https://exse.eyewated.com/pict/685a7203a46e35c9-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/sto-je-pfitznerova-metoda/">Što je Pfitznerova metoda?</a></h3>
<div class="amp-related-meta">
Windows </div>
</div>
</div>
</div>
<div class="amp-related-wrapper">
<h2>Sapid posts</h2>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/tko-moze-vidjeti-i-citati-svoje-postove-na-usluzi-twitter/">
<amp-img src="https://exse.eyewated.com/pict/4f89bf8ca79e2f40-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/tko-moze-vidjeti-i-citati-svoje-postove-na-usluzi-twitter/">Tko može vidjeti i čitati svoje postove na usluzi Twitter?</a></h3>
<div class="amp-related-meta">
Društveni mediji </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/kako-otvoriti-i-prijaviti-se-na-aim-na-aim-mailu/">
<amp-img src="https://exse.eyewated.com/pict/91bfd64abf3c30ab-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/kako-otvoriti-i-prijaviti-se-na-aim-na-aim-mailu/">Kako otvoriti i prijaviti se na AIM na AIM Mailu</a></h3>
<div class="amp-related-meta">
Softver i aplikacije </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/najbolje-igre-na-ruletu-za-vase-racunalo/">
<amp-img src="https://exse.eyewated.com/pict/f770a568f93f3c5d-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/najbolje-igre-na-ruletu-za-vase-racunalo/">Najbolje igre na ruletu za vaše računalo</a></h3>
<div class="amp-related-meta">
Vodiči za kupnju </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/koje-su-tocke-tvrtke-microsoft/">
<amp-img src="https://exse.eyewated.com/pict/6eddc84e444f3003-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/koje-su-tocke-tvrtke-microsoft/">Koje su točke tvrtke Microsoft?</a></h3>
<div class="amp-related-meta">
Kockanje </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/ubrzajte-sve-pregled-blu-ray-diska/">
<amp-img src="https://exse.eyewated.com/pict/2ae9fd3884fa37b0-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/ubrzajte-sve-pregled-blu-ray-diska/">Ubrzajte sve - pregled Blu-ray diska</a></h3>
<div class="amp-related-meta">
Recenzije proizvoda </div>
</div>
</div>
<div class="amp-related-content">
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/kako-popraviti-ostecene-ili-ostecene-datoteke-popisa-lozinki/">Kako popraviti oštećene ili oštećene datoteke popisa lozinki</a></h3>
<div class="amp-related-meta">
Windows </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/staples-besplatno-racunalna-i-tehnologija-recikliranje/">
<amp-img src="https://exse.eyewated.com/pict/4af3d0312a8f3239-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/staples-besplatno-racunalna-i-tehnologija-recikliranje/">Staples Besplatno Računalna i tehnologija Recikliranje</a></h3>
<div class="amp-related-meta">
Dobivanje dodatne pomoći </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/pracenje-i-druge-gps-usluge-mobitela/">
<amp-img src="https://exse.eyewated.com/pict/30c5ca20862b3411-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/pracenje-i-druge-gps-usluge-mobitela/">Praćenje i druge GPS usluge mobitela</a></h3>
<div class="amp-related-meta">
Novi i sljedeći </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/kako-se-mp3-i-aac-razlikuju-i-druge-vrste-datoteka-iphonea/">
<amp-img src="https://exse.eyewated.com/pict/634c52b9d0b534cc-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/kako-se-mp3-i-aac-razlikuju-i-druge-vrste-datoteka-iphonea/">Kako se MP3 i AAC razlikuju, i druge vrste datoteka iPhonea</a></h3>
<div class="amp-related-meta">
IPhone i iPod </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/guitar-hero-encore-rocks-80s-trikovi/">
<amp-img src="https://exse.eyewated.com/pict/83a8542f3c6339e6-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/guitar-hero-encore-rocks-80s-trikovi/">Guitar Hero Encore: Rocks '80s Trikovi</a></h3>
<div class="amp-related-meta">
Kockanje </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/top-ten-australski-razvojni-programeri-androidova/">
<amp-img src="https://exse.eyewated.com/pict/27f3ca744b41343d-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/top-ten-australski-razvojni-programeri-androidova/">Top Ten australski razvojni programeri Androidova</a></h3>
<div class="amp-related-meta">
Kockanje </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/11-najboljih-mini-projektora-za-kupnju-2018-godine/">
<amp-img src="https://exse.eyewated.com/pict/3c91fc820588345a-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/11-najboljih-mini-projektora-za-kupnju-2018-godine/">11 najboljih mini projektora za kupnju 2018. godine</a></h3>
<div class="amp-related-meta">
Vodiči za kupnju </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/rjesavanje-problema-digitalni-foto-okviri/">
<amp-img src="https://exse.eyewated.com/pict/e353df9d04aa49f2-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/rjesavanje-problema-digitalni-foto-okviri/">Rješavanje problema Digitalni foto okviri</a></h3>
<div class="amp-related-meta">
Digitalne kamere </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/cambridge-audio-minx-s215-5-1-kanalni-zvucnicki-sustav/">
<amp-img src="https://exse.eyewated.com/pict/d0a8604dbcd83431-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/cambridge-audio-minx-s215-5-1-kanalni-zvucnicki-sustav/">Cambridge Audio Minx S215 5.1 kanalni zvučnički sustav</a></h3>
<div class="amp-related-meta">
Recenzije proizvoda </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/sto-je-izvor-podataka/">
<amp-img src="https://exse.eyewated.com/pict/af6a25d575b93367-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/sto-je-izvor-podataka/">Što je izvor podataka?</a></h3>
<div class="amp-related-meta">
Softver </div>
</div>
</div>
<div class="amp-related-content">
<a href="https://hr.eyewated.com/silent-hill-shattered-memories-nocna-mora-faq/">
<amp-img src="https://exse.eyewated.com/pict/a77a6c15baac38e1-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img>
</a>
<div class="amp-related-text">
<h3><a href="https://hr.eyewated.com/silent-hill-shattered-memories-nocna-mora-faq/">'Silent Hill: Shattered Memories' noćna mora FAQ</a></h3>
<div class="amp-related-meta">
Kockanje </div>
</div>
</div>
</div></article>
<footer class="amp-wp-footer">
<div class="amp-wp-footer-inner">
<a href="#" class="back-to-top">Back to top</a>
<p class="copyright">
© 2024 hr.eyewated.com </p>
<div class="amp-wp-social-footer">
<a href="#" class="jeg_facebook"><i class="fa fa-facebook"></i> </a><a href="#" class="jeg_twitter"><i class="fa fa-twitter"></i> </a><a href="#" class="jeg_google-plus"><i class="fa fa-google-plus"></i> </a><a href="#" class="jeg_pinterest"><i class="fa fa-pinterest"></i> </a><a href="" class="jeg_rss"><i class="fa fa-rss"></i> </a>
</div>
</div>
</footer>
<div id="statcounter">
<amp-pixel src="https://c.statcounter.com/12022999/0/02d06b5d/1/">
</amp-pixel>
</div>
</body>
</html>
<!-- Dynamic page generated in 1.223 seconds. -->
<!-- Cached page generated by WP-Super-Cache on 2019-10-03 22:25:29 -->
<!-- 0.002 -->