{"id":1133,"date":"2013-03-15T18:19:23","date_gmt":"2013-03-15T23:19:23","guid":{"rendered":"http:\/\/wptest.io\/demo\/?page_id=1080"},"modified":"2013-03-15T18:19:23","modified_gmt":"2013-03-15T23:19:23","slug":"page-image-alignment","status":"publish","type":"page","link":"https:\/\/en.passengereye.com\/nb\/features\/page-image-alignment\/","title":{"rendered":"Justering av sidebilder"},"content":{"rendered":"

Velkommen til bildejustering! Den beste m\u00e5ten \u00e5 demonstrere de ulike alternativene for bildeplassering p\u00e5, er \u00e5 plassere dem i et hav av ord. Ta en padle\u00e5re, s\u00e5 setter vi i gang.<\/p>\n

N\u00e5r det gjelder justering, b\u00f8r det bemerkes at brukerne kan velge mellom f\u00f8lgende alternativer\u00a0Ingen<\/em>,\u00a0Venstre<\/em>,\u00a0Det stemmer, <\/em>og\u00a0Sentrum<\/em>. I tillegg f\u00e5r de ogs\u00e5 muligheten til \u00e5\u00a0Miniatyrbilde<\/em>,\u00a0Middels<\/em>,\u00a0Stor<\/em>\u00a0&\u00a0Full st\u00f8rrelse<\/em>.<\/p>\n

\"Image<\/p>\n

Bildet over er tilfeldigvis\u00a0sentrert<\/strong><\/em>.<\/p>\n

\"Image<\/strong>Resten av dette avsnittet er fyllstoff for at du skal kunne se at teksten omslutter bildet p\u00e5 150\u00d7150, som er venstrejustert<\/strong><\/em>.\u00a0<\/strong><\/p>\n

Som du ser, skal det v\u00e6re litt plass over, under og til h\u00f8yre for bildet. Teksten skal ikke krype inn i bildet. Krypende tekst er ikke bra. Bilder trenger ogs\u00e5 pusterom. La dem snakke som dine ord. La dem gj\u00f8re jobben sin uten \u00e5 bli forstyrret av teksten. Om en setning til ser vi at teksten beveger seg fra h\u00f8yre side av bildet og ned under bildet i en s\u00f8ml\u00f8s overgang. Igjen lar vi teksten gj\u00f8re jobben sin. Oppdraget er utf\u00f8rt!<\/p>\n

Og n\u00e5 til en enormt stort bilde<\/strong><\/em>. Den har ogs\u00e5 ingen justering<\/strong><\/em>.<\/p>\n

\"Image<\/p>\n

Selv om bildet over er 1200 px bredt, skal det ikke overfylle innholdsomr\u00e5det. Det skal ikke forstyrre innholdsflyten.<\/p>\n

\"Image<\/p>\n

Og n\u00e5 skal vi g\u00e5 over til \u00e5 se n\u00e6rmere p\u00e5 h\u00f8yrejustert<\/strong><\/em>. Igjen b\u00f8r det v\u00e6re rikelig med plass over, under og til venstre for bildet. Bare se p\u00e5 ham der... Hei! Du rocker den h\u00f8yre siden. Jeg bryr meg ikke om hva det venstrejusterte bildet sier, du ser bra ut. Ikke la noen andre fortelle deg noe annet.<\/p>\n

Om litt skal du se at teksten begynner \u00e5 legge seg under det h\u00f8yrejusterte bildet og legger seg fint til rette. Det skal fortsatt v\u00e6re god plass, og alt skal sitte pent. Ja... akkurat slik. Det har aldri f\u00f8ltes s\u00e5 godt \u00e5 ha rett.<\/p>\n

Og akkurat n\u00e5r du trodde vi var ferdige, gj\u00f8r vi dem om igjen med bildetekster!<\/p>\n

\"Image

Se p\u00e5 580\u00d7300 som f\u00e5r litt bildetekst<\/a> kj\u00e6rlighet.<\/p><\/div>\n

Bildet over er tilfeldigvis\u00a0sentrert<\/strong><\/em>. Bildeteksten inneholder ogs\u00e5 en lenke, bare for \u00e5 se om den gj\u00f8r noe rart.<\/p>\n

\"Image

En bitteliten bildetekst.<\/p><\/div>\n

<\/strong>Resten av dette avsnittet er fyllstoff for at du skal kunne se at teksten omslutter bildet p\u00e5 150\u00d7150, som er venstrejustert<\/strong><\/em>.\u00a0<\/strong><\/p>\n

Som du ser, skal det v\u00e6re litt plass over, under og til h\u00f8yre for bildet. Teksten skal ikke krype inn i bildet. Krypende tekst er ikke bra. Bilder trenger ogs\u00e5 pusterom. La dem snakke som dine ord. La dem gj\u00f8re jobben sin uten \u00e5 bli forstyrret av teksten. Om en setning til ser vi at teksten beveger seg fra h\u00f8yre side av bildet og ned under bildet i en s\u00f8ml\u00f8s overgang. Igjen lar vi teksten gj\u00f8re jobben sin. Oppdraget er utf\u00f8rt!<\/p>\n

Og n\u00e5 til en enormt stort bilde<\/strong><\/em>. Den har ogs\u00e5 ingen justering<\/strong><\/em>.<\/p>\n

\"Image

Massiv bildekommentar for \u00f8yeeplene dine.<\/p><\/div>\n

Selv om bildet over er 1200 px bredt, skal det ikke overfylle innholdsomr\u00e5det. Det skal ikke forstyrre innholdsflyten.<\/p>\n

\"Image

Det f\u00f8les godt \u00e5 ha rett hele tiden.<\/p><\/div>\n

Og n\u00e5 skal vi g\u00e5 over til \u00e5 se n\u00e6rmere p\u00e5 h\u00f8yrejustert<\/strong><\/em>. Igjen b\u00f8r det v\u00e6re rikelig med plass over, under og til venstre for bildet. Bare se p\u00e5 ham der... Hei! Du rocker den h\u00f8yre siden. Jeg bryr meg ikke om hva det venstrejusterte bildet sier, du ser bra ut. Ikke la noen andre fortelle deg noe annet.<\/p>\n

Om litt skal du se at teksten begynner \u00e5 legge seg under det h\u00f8yrejusterte bildet og legger seg fint til rette. Det skal fortsatt v\u00e6re god plass, og alt skal sitte pent. Ja... akkurat slik. Det har aldri f\u00f8ltes s\u00e5 godt \u00e5 ha rett.<\/p>\n

Og det var det! Du har overlevd justeringens turbulente farvann. Prestasjonen for bildejustering er l\u00e5st opp!<\/p>","protected":false},"excerpt":{"rendered":"

Welcome to image alignment! The best way to demonstrate the ebb and flow of the various image positioning options is to nestle them snuggly among an ocean of words. Grab a paddle and let’s get […]<\/p>","protected":false},"author":1,"featured_media":0,"parent":12,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/en.passengereye.com\/nb\/wp-json\/wp\/v2\/pages\/1133"}],"collection":[{"href":"https:\/\/en.passengereye.com\/nb\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/en.passengereye.com\/nb\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/en.passengereye.com\/nb\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/en.passengereye.com\/nb\/wp-json\/wp\/v2\/comments?post=1133"}],"version-history":[{"count":0,"href":"https:\/\/en.passengereye.com\/nb\/wp-json\/wp\/v2\/pages\/1133\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/en.passengereye.com\/nb\/wp-json\/wp\/v2\/pages\/12"}],"wp:attachment":[{"href":"https:\/\/en.passengereye.com\/nb\/wp-json\/wp\/v2\/media?parent=1133"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}