Kā izveidot CSS kolonnu izkārtojumu

CSS izkārtojums prasa domāt par jūsu vietnes izkārtojumu kopumā, pēc tam ņemt gabalus un tos salikt kopā. Uzziniet, kā izveidot vienkāršu 3 kolonnu izkārtojumu ar CSS.

01 no 09

Zīmējiet savu izkārtojumu

J Kirnins

Jūs varat izdarīt izkārtojumu uz papīra vai grafikas programmā . Ja jums jau ir plāns rāmis vai vēl plašāks dizains, vienkāršojiet to pamata lodziņos, kas veido vietni. Šim rakstam pievienotajam dizainam ir trīs kolonnas galvenajā satura apgabalā, kā arī virsraksts un kājene. Ja paskatās uzmanīgi, jūs varat redzēt, ka trīs kolonnas nav vienādas ar platumu.

Pēc tam, kad ir izvilkts izkārtojums, varat sākt domāt par izmēriem. Šajā piemērā dizainam ir šādi pamata dimensijas:

02 no 09

Uzrakstiet pamata HTML / CSS un izveidojiet konteinera elementu

Tā kā šī lapa būs derīgs HTML dokuments, sāciet ar tukšu HTML konteineru

Untitled Document </ title> </ head> <body> </ body> </ html> <p> Pievienojiet pamata CSS stilos, lai <a href="https://lv.eyewated.com/izmantojiet-css-lai-izlidzinatu-savus-marzas-un-robezas/">nulles no lapas malas, robežas un spilventiņi</a> . Lai gan ir pieejami arī citi <a href="https://lv.eyewated.com/iepazit-kaskades-stila-lapas-ar-so-css-cheat-sheet/">standarta CSS stili</a> jauniem dokumentiem, šie stili ir minimālais, kas nepieciešams, lai iegūtu tīru izkārtojumu. Pievienojiet tos dokumenta galvai: </p> <style type = "text / css"> html, body {margin: 0px; polsterējums: 0 pikseļi; robeža: 0px; } </ style> <p> Lai sāktu veidot izkārtojumu, ielieciet konteinera elementu. Dažreiz gadās, ka jūs varat atbrīvoties no konteinera vēlāk, taču lielākajai daļai fiksēta platuma izkārtojumu konteinera elements ir vieglāk pārvaldāms dažādās tīmekļa pārlūkprogrammās. Tātad ķermenī ir šādi: </p> <div id = "konteiners"> </ div> <p> Un CSS stila lapā ievietojiet: </p> #container {} <p> <strong>03 no 09</strong> </p> <h3> Stilsiet konteineru </h3><p> Tvertne nosaka, cik plašs ir tīmekļa lapas saturs, kā arī visas ārējās malas un polsterējums iekšpusē. Šim dokumentam konteiners ir 870 pikseļu platums, bet kreisajā pusē - 20 pikseļu teknes. Ūdens notekas ir izveidota ar margin stila, bet konteinera polsterējums ir nulēts, lai novērstu jebkādu elementu plūsmu kā konteiners. </p> #container {width: 870px; starpība: 0 0 0 20 pikseļi; / * augšējais labais apakšējais kreisais * / polsterējums: 0; } <p> Ja jūs tagad saglabājat dokumentu, tas būs grūti redzēt konteineru, jo tajā nav nekas. Ja pievienosit vietturu tekstu, jūs varat redzēt konteinera elementu skaidrāk. </p> <p> <strong>04 no 09</strong> </p> <h3> Izmantojiet virsraksta tagu virsrakstam </h3><p> Kā jūs nolemjat veidot galvenes rindu, daudz atkarīgs no tā, kas tajā atrodas. Ja galvenes rindā tikai būs logotipa grafiks un virsraksts, tad, izmantojot virsraksta tagu (<h1>), ir daudz jēgas, nekā izmantot <div>. Jūs varat veidot virsrakstu tādā pašā veidā, kā jūs veidojat div, un jūs izvairītos no ārējiem tagiem. </p> <p> Galvenes rindas HTML ietvert konteinera augšpusē un izskatās šādi: </p> <h1> Mana galvenes rinda </ h1> <p> Tad, lai iestatītu stilu uz tā, sarkanā robeža tika pievienota apakšā, lai jūs varētu redzēt, kur tas beidzas, margas un polsterējums tika nulles, platums iestatīts uz 100% un augstums līdz 150 pikseļi: </p> #container h1 {margin: 0; polsterējums: 0; platums: 100%; augstums: 150 pikseļi; pludiņš: pa kreisi; border-bottom: # c00 solid 3px; } <p> Neaizmirstiet peldēt šo elementu ar pludiņu: pa kreisi; īpašums. CSS izkārtojumu rakstīšanas atslēga ir visu peldēt - pat tādas lietas, kas ir tādā pašā platumā kā konteiners. Tādā veidā jūs vienmēr zināt, kur elementi atrodas lapā. </p> <p> <a href="https://lv.eyewated.com/kas-ir-css-pecteca-atlasitajs/">CSS pēcnācējs selektors</a> pielietoja stilus tikai tiem H1 elementiem, kas atrodas #container elementā. </p> <p> <strong>05 no 09</strong> </p> <h3> Lai iegūtu trīs kolonnas, sāciet veidot divas kolonnas </h3><p> Ja veidojat trīs kolonnu izkārtojumu ar CSS, jums ir jāsadala izkārtojums divās grupās. Tātad šim trīs kolonnu izkārtojumam - vidējai un labajai kolonnai un grupēti un novietoti blakus kreisās kolonnas divu sleju izkārtojumam, kur kreisā kolonna ir 250 pikseļu platuma, bet labā sleja ir 610 pikseļu platums (katrai no abām kolonnām - 300 , plus 10 pikseļi notekām starp tām). </p> <p> HTML izskatās šādi: </p> <div id = "col1"> <p> Ut aliquip ex ea commodo consequat. Velit esse cillum dolor ut enim ad minim veniam, lorem ipsum dolor sit amet. Reprehenderit in volupate quis nostrud exercice eu fugiat nulla pariatur. Velitesse cillum dolore ullamco laboris nisi ut aliquip ex ea commodo consequat. </ P> </ div> <div id = "col2outer"> <p> Tas viss ir minimāls laiks, un tas ir laiks, kas nepieciešams, lai uzlabotu darba kvalitāti. Ut labore et dolore magna aliqua. Velit esse cillum dolore eu fugiat nulla pariatur. </ P> </ div> <p> Kolonnu vietā ievietoto teksta vietā tie kļūst redzamāki, veicot testēšanu. CSS izskatās šādi: </p> #container # col1 (platums: 250 pikseļi; pludiņš: pa kreisi; } #container # col2outer {width: 610px; pludiņš: pa labi; starpība: 0; polsterējums: 0; } <p> Kreisajā pusē esošā kolonna tiek peldēta pa kreisi, bet otra peldēta pa labi. Tā kā abu sleju kopējais platums ir 860 pikseļi, starp tiem ir 10 pikseļu teknes. </p> <p> <strong>06 no 09</strong> </p> <h3> Pievienojiet divas kolonnas plāna otrajā slejā </h3><p> Lai izveidotu trīs kolonnas, pievienojiet divus divus iekšpusē plašākajā otrajā slejā, tāpat kā pēdējā solī pievienojāt 2 divus konteinera kolonnā. HTML izskatās šādi: </p> <div id = "col2outer"> <div id = "col2mid"> <p> Tas viss ir minimāls, un tas ir laiks, kad jūs mēģināt strādāt. Ut labore et dolore magna aliqua. </ P> </ div> <div id = "col2side"> <p> Nam libero tempore, quia voluptas sit aspernatur dicta sunt explicabo. Ullam corporis suscipit laboriosam, magnam aliquam quaerat voluptatem. Itaque earum rerum ir ļoti svarīgs faktors, kas ietekmē cilvēka veselību un dzīvesveidu. </ P> </ div> </ div> <p> Un CSS izskatās šādi: </p> # col2outer # col2mid {width: 300px; pludiņš: pa kreisi; } # col2outer # col2side {width: 300px; pludiņš: pa labi; } <p> Tā kā šīs divas 300 pikseļu platās kastes ir iekļautas 610 pikseļu platā lodziņā, starp tām atkal ir 10 pikseļu tekne. </p> <p> <strong>07 no 09</strong> </p> <h3> Pievienojiet kājenei </h3><p> Tagad, kad pārējā lapa ir veidota, varat pievienot kājenē. Izmantojiet pēdējo div ar "footer" id un pievienojiet saturu, lai to varētu redzēt. Augšā varat pievienot robežu, lai jūs zināt, no kurienes tas sākas. </p> <p> HTML: </p> <div id = "footer"> <p> Copyright © 2017 </ p> </ div> <p> CSS: </p> #container #footer {peldēt: pa kreisi; platums: 870 pikseļi; border-top: # c00 solid 3px; } <p> <strong>08 no 09</strong> </p> <h3> Pievienot personīgajiem stiliem un saturu </h3><p> Tagad, kad esat pabeidzis izkārtojumu, varat sākt pievienot personīgos stilus un saturu. Atcerieties, ka virsraksti un kājenes ir pievienotas, lai parādītu izkārtojuma sadaļas, nevis dizainu. </p> <p> <strong>09 no 09</strong> </p> <h3> Galīgais HTML / CSS </h3><p> Šeit ir viss dokuments, HTML un CSS: </p> <! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns = "http : //www.w3.org/1999/xhtml "> <head> <meta http-equiv =" Content-Type "content =" text / html; charset = utf-8 "/> <title> Untitled Document </ title> <style type = "text / css"> html, body {margin: 0px; polsterējums: 0 pikseļi; robeža: 0px; } #container {width: 870px; starpība: 0 0 0 20 pikseļi; / * augšējais labais apakšējais kreisais * / polsterējums: 0; fona krāsa: #fff; } #container h1 {margin: 0; polsterējums: 0; platums: 100%; augstums: 150 pikseļi; pludiņš: pa kreisi; border-bottom: # c00 solid 3px; } #container # col1 {width: 250px; pludiņš: pa kreisi; } #container # col2outer {width: 610px; pludiņš: pa labi; starpība: 0; polsterējums: 0; } # col2outer # col2mid {width: 300px; pludiņš: pa kreisi; } # col2outer # col2side {width: 300px; pludiņš: pa labi; } #container #footer {peldēt: pa kreisi; platums: 870 pikseļi; border-top: # c00 solid 3px; } </ style> </ head> <body> <div id = "container"> <h1> Mana galvenes rinda </ h1> <div id = "col1"> <p> p> </ div> <div id = "col2outer"> <div id = "col2mid"> <p> Vismaz un minimāli. </ p> </ div> <div id = "col2side"> <p> Nam libero tempore. </ P> </ div> </ div> <div id = "footer"> <p> Copyright © 2008 </ p> </ div> </ div> </ body> </ html> </div> <div class="amp-related-wrapper"> <h2>Alike posts</h2> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/ka-lietot-css-lai-iestatitu-html-elementa-augstumu-lidz-100/">Kā lietot CSS, lai iestatītu HTML elementa augstumu līdz 100%</a></h3> <div class="amp-related-meta"> Web dizains un izstrāde </div> </div> </div> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/biezi-uzdotie-jautajumi-par-web-dizains-html-css-un-web-izstrade/">Bieži uzdotie jautājumi par Web Dizains, HTML, CSS un Web izstrāde</a></h3> <div class="amp-related-meta"> Web dizains un izstrāde </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/ka-mainit-fontu-timekla-lapas-izmantojot-css/"> <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://lv.eyewated.com/ka-mainit-fontu-timekla-lapas-izmantojot-css/">Kā mainīt fontu tīmekļa lapās, izmantojot CSS</a></h3> <div class="amp-related-meta"> Web dizains un izstrāde </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/uzziniet-par-css3-neskaidribu/"> <amp-img src="https://exse.eyewated.com/pict/9f46defb47b433c7-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/uzziniet-par-css3-neskaidribu/">Uzziniet par CSS3 neskaidrību</a></h3> <div class="amp-related-meta"> Web dizains un izstrāde </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/ka-bloket-web-lapu-no-drukasanas-ar-css/"> <amp-img src="https://exse.eyewated.com/pict/ec81fd353f1033a0-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/ka-bloket-web-lapu-no-drukasanas-ar-css/">Kā bloķēt Web lapu no drukāšanas ar CSS</a></h3> <div class="amp-related-meta"> Web dizains un izstrāde </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/ka-izmantot-css-pozicionesanu-lai-izveidotu-izkartojumus-bez-tabulam/"> <amp-img src="https://exse.eyewated.com/pict/ca4194b55aa73239-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/ka-izmantot-css-pozicionesanu-lai-izveidotu-izkartojumus-bez-tabulam/">Kā izmantot CSS pozicionēšanu, lai izveidotu izkārtojumus bez tabulām</a></h3> <div class="amp-related-meta"> Web dizains un izstrāde </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/css-ipasuma-definicija/"> <amp-img src="https://exse.eyewated.com/pict/3a2920899cf83249-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/css-ipasuma-definicija/">CSS īpašuma definīcija</a></h3> <div class="amp-related-meta"> Web dizains un izstrāde </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/parskats-par-css-mantojumu/"> <amp-img src="https://exse.eyewated.com/pict/357261af990f3b51-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/parskats-par-css-mantojumu/">Pārskats par CSS mantojumu</a></h3> <div class="amp-related-meta"> Web dizains un izstrāde </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/notepad-izveidosana-izveidota-timekla-lapa-ar-css/"> <amp-img src="https://exse.eyewated.com/pict/4b7ab57836bf3365-120x86.gif" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/notepad-izveidosana-izveidota-timekla-lapa-ar-css/">Notepad izveidošana izveidota tīmekļa lapa ar CSS</a></h3> <div class="amp-related-meta"> Web dizains un izstrāde </div> </div> </div> </div> <div class="amp-related-wrapper"> <h2>See Newest</h2> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/11-labakas-video-redigesanas-programmaturas-iegade-2018-gada/">11 labākās video rediģēšanas programmatūras iegāde 2018. gadā</a></h3> <div class="amp-related-meta"> Tīmekļa vietne un meklēšana </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/atrodiet-informaciju-datu-tabulas-izmantojot-excel-lookup-funkciju/"> <amp-img src="https://exse.eyewated.com/pict/9deeccd540fc3a0a-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/atrodiet-informaciju-datu-tabulas-izmantojot-excel-lookup-funkciju/">Atrodiet informāciju datu tabulās, izmantojot Excel LOOKUP funkciju</a></h3> <div class="amp-related-meta"> Programmatūra </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/ios-6-pamati/"> <amp-img src="https://exse.eyewated.com/pict/b2aa29d71565314f-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/ios-6-pamati/">IOS 6: pamati</a></h3> <div class="amp-related-meta"> IPhone un iPod </div> </div> </div> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/ka-pievienot-attelu-kontaktam-pakalpojuma-gmail/">Kā pievienot attēlu kontaktam pakalpojumā Gmail</a></h3> <div class="amp-related-meta"> E-pasts un ziņojumi </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/macrorit-data-wiper-v4-1-4/"> <amp-img src="https://exse.eyewated.com/pict/c628dd190a3534db-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/macrorit-data-wiper-v4-1-4/">Macrorit Data Wiper v4.1.4</a></h3> <div class="amp-related-meta"> Programmatūra un programmas </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/kas-ir-css-un-kur-ta-tiek-lietota/"> <amp-img src="https://exse.eyewated.com/pict/4494c19ed3012f92-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/kas-ir-css-un-kur-ta-tiek-lietota/">Kas ir CSS un kur tā tiek lietota?</a></h3> <div class="amp-related-meta"> Web dizains un izstrāde </div> </div> </div> </div> <div class="amp-related-wrapper"> <h2>Sapid posts</h2> <div class="amp-related-content"> <a href="https://lv.eyewated.com/10-bezmaksas-grafistes-programmas-studentiem/"> <amp-img src="https://exse.eyewated.com/pict/249571557eac349f-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/10-bezmaksas-grafistes-programmas-studentiem/">10 Bezmaksas grāfistes programmas studentiem</a></h3> <div class="amp-related-meta"> Tīmekļa vietne un meklēšana </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/ka-uzstadit-homebrew-kanalu-wii-u-wii-rezima/"> <amp-img src="https://exse.eyewated.com/pict/cd9daf096a933273-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/ka-uzstadit-homebrew-kanalu-wii-u-wii-rezima/">Kā uzstādīt Homebrew kanālu Wii U Wii režīmā</a></h3> <div class="amp-related-meta"> Spēle </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/detalizets-celvedis-ka-izdzest-bezsaistes-gmail-kesatminas-datus/"> <amp-img src="https://exse.eyewated.com/pict/b9db22025c2c346b-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/detalizets-celvedis-ka-izdzest-bezsaistes-gmail-kesatminas-datus/">Detalizēts ceļvedis, kā izdzēst bezsaistes Gmail kešatmiņas datus</a></h3> <div class="amp-related-meta"> E-pasts un ziņojumi </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/ka-atspejot-sistemas-atjaunosanu-sistema-windows-lai-nonemtu-virusus/"> <amp-img src="https://exse.eyewated.com/pict/36f4b0b6e36a333f-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/ka-atspejot-sistemas-atjaunosanu-sistema-windows-lai-nonemtu-virusus/">Kā atspējot sistēmas atjaunošanu sistēmā Windows, lai noņemtu vīrusus</a></h3> <div class="amp-related-meta"> Windows </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/galvenas-mekletaju-programmas-biezi-uzdotie-jautajumi/"> <amp-img src="https://exse.eyewated.com/pict/982332d0d9224774-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/galvenas-mekletaju-programmas-biezi-uzdotie-jautajumi/">Galvenās meklētāju programmas bieži uzdotie jautājumi</a></h3> <div class="amp-related-meta"> Programmatūra un programmas </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/apple-meness-jaunakais-sajuta-cloud-arena/"> <amp-img src="https://exse.eyewated.com/pict/ec48a664a3e3355f-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/apple-meness-jaunakais-sajuta-cloud-arena/">Apple Mēness - jaunākais sajūta Cloud Arena</a></h3> <div class="amp-related-meta"> Tīmekļa vietne un meklēšana </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/riepu-spiediena-monitorings/"> <amp-img src="https://exse.eyewated.com/pict/0cd3d522b21c3401-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/riepu-spiediena-monitorings/">Riepu spiediena monitorings</a></h3> <div class="amp-related-meta"> Auto tehniķis </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/ka-runat-ar-tehnisko-atbalstu/"> <amp-img src="https://exse.eyewated.com/pict/7658365a7ef94384-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/ka-runat-ar-tehnisko-atbalstu/">Kā runāt ar tehnisko atbalstu</a></h3> <div class="amp-related-meta"> Palīdzības saņemšana </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/kas-nepieciesams-lai-redzetu-4k-izskirtspeju-4k-ultra-hd-tv/"> <amp-img src="https://exse.eyewated.com/pict/af31392051a63593-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/kas-nepieciesams-lai-redzetu-4k-izskirtspeju-4k-ultra-hd-tv/">Kas nepieciešams, lai redzētu 4K izšķirtspēju 4K Ultra HD TV</a></h3> <div class="amp-related-meta"> Mājas kinozāles </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/viena-speletaja-minecraft-prieki/"> <amp-img src="https://exse.eyewated.com/pict/0f21f30c7b2f3188-120x86.png" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/viena-speletaja-minecraft-prieki/">Viena spēlētāja Minecraft prieki</a></h3> <div class="amp-related-meta"> Spēle </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/ka-eksportet-pastu-no-incredimail-uz-citu-e-pasta-programmu/"> <amp-img src="https://exse.eyewated.com/pict/a9671578869e2e7a-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/ka-eksportet-pastu-no-incredimail-uz-citu-e-pasta-programmu/">Kā eksportēt pastu no IncrediMail uz citu e-pasta programmu</a></h3> <div class="amp-related-meta"> E-pasts un ziņojumi </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/yu-gi-oh-falsebound-kingdom-miklas-gamecube/"> <amp-img src="https://exse.eyewated.com/pict/8f6e94718d98308a-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/yu-gi-oh-falsebound-kingdom-miklas-gamecube/">Yu-Gi-Oh: Falsebound Kingdom Mīklas - Gamecube</a></h3> <div class="amp-related-meta"> Spēle </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/ka-aktivizet-pilnekrana-rezimu-parlukprogramma-google-chrome/"> <amp-img src="https://exse.eyewated.com/pict/de1bdd8c77263423-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/ka-aktivizet-pilnekrana-rezimu-parlukprogramma-google-chrome/">Kā aktivizēt pilnekrāna režīmu pārlūkprogrammā Google Chrome</a></h3> <div class="amp-related-meta"> Pārlūkprogrammas </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/geotagging-kameras/"> <amp-img src="https://exse.eyewated.com/pict/d9aa635203e034cf-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/geotagging-kameras/">Geotagging kameras</a></h3> <div class="amp-related-meta"> Digitālās fotokameras </div> </div> </div> <div class="amp-related-content"> <a href="https://lv.eyewated.com/koplietojiet-jebkuru-pievienoto-printeri-vai-faksu-ar-citiem-mac-datoriem/"> <amp-img src="https://exse.eyewated.com/pict/867dcb56ef5336f4-120x86.jpg" width="120" height="86" layout="responsive" class="amp-related-image"></amp-img> </a> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/koplietojiet-jebkuru-pievienoto-printeri-vai-faksu-ar-citiem-mac-datoriem/">Koplietojiet jebkuru pievienoto printeri vai faksu ar citiem Mac datoriem</a></h3> <div class="amp-related-meta"> Macs </div> </div> </div> <div class="amp-related-content"> <div class="amp-related-text"> <h3><a href="https://lv.eyewated.com/kas-ir-apakstikla-maska/">Kas ir apakštīkla maska?</a></h3> <div class="amp-related-meta"> Windows </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 lv.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.306 seconds. --> <!-- Cached page generated by WP-Super-Cache on 2019-10-03 23:13:59 --> <!-- 0.002 -->