{"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\/pl\/features\/page-image-alignment\/","title":{"rendered":"Wyr\u00f3wnanie obrazu strony"},"content":{"rendered":"<p>Witamy w wyr\u00f3wnaniu obraz\u00f3w! Najlepszym sposobem na zademonstrowanie przyp\u0142yw\u00f3w i odp\u0142yw\u00f3w r\u00f3\u017cnych opcji pozycjonowania obraz\u00f3w jest umieszczenie ich w oceanie s\u0142\u00f3w. Chwy\u0107 wios\u0142o i zaczynajmy.<\/p>\n<p>Je\u015bli chodzi o wyr\u00f3wnanie, nale\u017cy zauwa\u017cy\u0107, \u017ce u\u017cytkownicy mog\u0105 wybiera\u0107 spo\u015br\u00f3d nast\u0119puj\u0105cych opcji\u00a0<em>Brak<\/em>,\u00a0<em>Lewa<\/em>,\u00a0<em>Racja, <\/em>oraz\u00a0<em>Centrum<\/em>. Ponadto otrzymuj\u0105 oni r\u00f3wnie\u017c opcje\u00a0<em>Miniatura<\/em>,\u00a0<em>\u015aredni<\/em>,\u00a0<em>Du\u017cy<\/em>\u00a0&amp;\u00a0<em>Fullsize<\/em>.<\/p>\n<p style=\"text-align:center;\"><img loading=\"lazy\" class=\"size-full wp-image-906 aligncenter\" title=\"Wyr\u00f3wnanie obrazu 580x300\" alt=\"Image Alignment 580x300\" src=\"http:\/\/demo.leafcolor.com\/applay\/wp-content\/uploads\/2013\/03\/image-alignment-580x300.jpg\" width=\"580\" height=\"300\" \/><\/p>\n<p>Powy\u017cszy obraz to\u00a0<em><strong>wy\u015brodkowany<\/strong><\/em>.<\/p>\n<p><strong><img loading=\"lazy\" class=\"size-full wp-image-904 alignleft\" title=\"Wyr\u00f3wnanie obrazu 150x150\" alt=\"Image Alignment 150x150\" src=\"http:\/\/demo.leafcolor.com\/applay\/wp-content\/uploads\/2013\/03\/image-alignment-150x150.jpg\" width=\"150\" height=\"150\" \/><\/strong>Reszta tego akapitu jest wype\u0142niaczem, aby zobaczy\u0107 tekst owini\u0119ty wok\u00f3\u0142 obrazu 150 \u00d7 150, kt\u00f3ry jest <em><strong>wyr\u00f3wnane do lewej<\/strong><\/em>.\u00a0<strong><\/strong><\/p>\n<p>Jak wida\u0107, powinno by\u0107 troch\u0119 miejsca powy\u017cej, poni\u017cej i po prawej stronie obrazu. Tekst nie powinien pe\u0142za\u0107 po obrazie. Pe\u0142zanie jest po prostu niew\u0142a\u015bciwe. Obrazy r\u00f3wnie\u017c potrzebuj\u0105 przestrzeni. Pozw\u00f3l im m\u00f3wi\u0107 jak s\u0142owom. Niech wykonuj\u0105 swoj\u0105 prac\u0119 bez przeszk\u00f3d ze strony tekstu. W kolejnym zdaniu zobaczymy, \u017ce tekst przesuwa si\u0119 z prawej strony obrazu w d\u00f3\u0142 pod obrazem w p\u0142ynnym przej\u015bciu. Ponownie, pozwalaj\u0105c tekstowi robi\u0107 swoje. Misja zako\u0144czona!<\/p>\n<p>A teraz dla <em><strong>Bardzo du\u017cy obraz<\/strong><\/em>. Posiada r\u00f3wnie\u017c <em><strong>brak wyr\u00f3wnania<\/strong><\/em>.<\/p>\n<p><img loading=\"lazy\" class=\"alignnone  wp-image-907\" title=\"Wyr\u00f3wnanie obrazu 1200x400\" alt=\"Image Alignment 1200x400\" src=\"http:\/\/demo.leafcolor.com\/applay\/wp-content\/uploads\/2013\/03\/image-alignment-1200x4002.jpg\" width=\"1200\" height=\"400\" \/><\/p>\n<p>Powy\u017cszy obraz, mimo \u017ce ma szeroko\u015b\u0107 1200 pikseli, nie powinien przepe\u0142nia\u0107 obszaru zawarto\u015bci. Powinien pozosta\u0107 zamkni\u0119ty bez widocznych zak\u0142\u00f3ce\u0144 w przep\u0142ywie tre\u015bci.<\/p>\n<p><img loading=\"lazy\" class=\"size-full wp-image-905 alignright\" title=\"Wyr\u00f3wnanie obrazu 300x200\" alt=\"Image Alignment 300x200\" src=\"http:\/\/demo.leafcolor.com\/applay\/wp-content\/uploads\/2013\/03\/image-alignment-300x200.jpg\" width=\"300\" height=\"200\" \/><\/p>\n<p>A teraz przeniesiemy rzeczy do <em><strong>wyr\u00f3wnanie do prawej<\/strong><\/em>. Ponownie, powinno by\u0107 du\u017co miejsca powy\u017cej, poni\u017cej i po lewej stronie obrazu. Tylko sp\u00f3jrz na niego... Hej kole\u015b! Dobra robota z t\u0105 praw\u0105 stron\u0105. Nie obchodzi mnie, co m\u00f3wi obraz wyr\u00f3wnany do lewej, wygl\u0105dasz \u015bwietnie. Nie daj sobie wm\u00f3wi\u0107, \u017ce jest inaczej.<\/p>\n<p>Po chwili powiniene\u015b zobaczy\u0107, jak tekst zaczyna zawija\u0107 si\u0119 poni\u017cej wyr\u00f3wnanego do prawej obrazu i \u0142adnie si\u0119 uk\u0142ada\u0107. Powinno by\u0107 jeszcze du\u017co miejsca i wszystko powinno \u0142adnie wygl\u0105da\u0107. Tak... W\u0142a\u015bnie tak. Nigdy nie czu\u0142em si\u0119 tak dobrze, maj\u0105c racj\u0119.<\/p>\n<p>A kiedy ju\u017c my\u015bla\u0142e\u015b, \u017ce sko\u0144czyli\u015bmy, zrobimy to wszystko od nowa z podpisami!<\/p>\n<div id=\"attachment_906\" style=\"width: 590px\" class=\"wp-caption aligncenter\"><img aria-describedby=\"caption-attachment-906\" loading=\"lazy\" class=\"size-full wp-image-906\" title=\"Wyr\u00f3wnanie obrazu 580x300\" alt=\"Image Alignment 580x300\" src=\"http:\/\/demo.leafcolor.com\/applay\/wp-content\/uploads\/2013\/03\/image-alignment-580x300.jpg\" width=\"580\" height=\"300\" \/><p id=\"caption-attachment-906\" class=\"wp-caption-text\">Wygl\u0105da na to, \u017ce 580\u00d7300 <a title=\"Ustawienia obrazu\" href=\"http:\/\/en.support.wordpress.com\/images\/image-settings\/\">podpis<\/a> mi\u0142o\u015b\u0107.<\/p><\/div>\n<p>Powy\u017cszy obraz to\u00a0<em><strong>wy\u015brodkowany<\/strong><\/em>. W podpisie znajduje si\u0119 r\u00f3wnie\u017c link, aby sprawdzi\u0107, czy robi co\u015b dziwnego.<\/p>\n<div id=\"attachment_904\" style=\"width: 160px\" class=\"wp-caption alignleft\"><img aria-describedby=\"caption-attachment-904\" loading=\"lazy\" class=\"size-full wp-image-904\" title=\"Wyr\u00f3wnanie obrazu 150x150\" alt=\"Image Alignment 150x150\" src=\"http:\/\/demo.leafcolor.com\/applay\/wp-content\/uploads\/2013\/03\/image-alignment-150x150.jpg\" width=\"150\" height=\"150\" \/><p id=\"caption-attachment-904\" class=\"wp-caption-text\">Niewielki podpis.<\/p><\/div>\n<p><strong><\/strong>Reszta tego akapitu jest wype\u0142niaczem, aby zobaczy\u0107 tekst owini\u0119ty wok\u00f3\u0142 obrazu 150 \u00d7 150, kt\u00f3ry jest <em><strong>wyr\u00f3wnane do lewej<\/strong><\/em>.\u00a0<strong><\/strong><\/p>\n<p>Jak wida\u0107, powinno by\u0107 troch\u0119 miejsca powy\u017cej, poni\u017cej i po prawej stronie obrazu. Tekst nie powinien pe\u0142za\u0107 po obrazie. Pe\u0142zanie jest po prostu niew\u0142a\u015bciwe. Obrazy r\u00f3wnie\u017c potrzebuj\u0105 przestrzeni. Pozw\u00f3l im m\u00f3wi\u0107 jak s\u0142owom. Niech wykonuj\u0105 swoj\u0105 prac\u0119 bez przeszk\u00f3d ze strony tekstu. W kolejnym zdaniu zobaczymy, \u017ce tekst przesuwa si\u0119 z prawej strony obrazu w d\u00f3\u0142 pod obrazem w p\u0142ynnym przej\u015bciu. Ponownie, pozwalaj\u0105c tekstowi robi\u0107 swoje. Misja zako\u0144czona!<\/p>\n<p>A teraz dla <em><strong>Bardzo du\u017cy obraz<\/strong><\/em>. Posiada r\u00f3wnie\u017c <em><strong>brak wyr\u00f3wnania<\/strong><\/em>.<\/p>\n<div id=\"attachment_907\" style=\"width: 1210px\" class=\"wp-caption alignnone\"><img aria-describedby=\"caption-attachment-907\" loading=\"lazy\" class=\"wp-image-907\" title=\"Wyr\u00f3wnanie obrazu 1200x400\" alt=\"Image Alignment 1200x400\" src=\"http:\/\/demo.leafcolor.com\/applay\/wp-content\/uploads\/2013\/03\/image-alignment-1200x4002.jpg\" width=\"1200\" height=\"400\" \/><p id=\"caption-attachment-907\" class=\"wp-caption-text\">Ogromny komentarz graficzny dla twoich oczu.<\/p><\/div>\n<p>Powy\u017cszy obraz, mimo \u017ce ma szeroko\u015b\u0107 1200 pikseli, nie powinien przepe\u0142nia\u0107 obszaru zawarto\u015bci. Powinien pozosta\u0107 zamkni\u0119ty bez widocznych zak\u0142\u00f3ce\u0144 w przep\u0142ywie tre\u015bci.<\/p>\n<div id=\"attachment_905\" style=\"width: 310px\" class=\"wp-caption alignright\"><img aria-describedby=\"caption-attachment-905\" loading=\"lazy\" class=\"size-full wp-image-905\" title=\"Wyr\u00f3wnanie obrazu 300x200\" alt=\"Image Alignment 300x200\" src=\"http:\/\/demo.leafcolor.com\/applay\/wp-content\/uploads\/2013\/03\/image-alignment-300x200.jpg\" width=\"300\" height=\"200\" \/><p id=\"caption-attachment-905\" class=\"wp-caption-text\">Dobrze jest mie\u0107 racj\u0119 przez ca\u0142y czas.<\/p><\/div>\n<p>A teraz przeniesiemy rzeczy do <em><strong>wyr\u00f3wnanie do prawej<\/strong><\/em>. Ponownie, powinno by\u0107 du\u017co miejsca powy\u017cej, poni\u017cej i po lewej stronie obrazu. Tylko sp\u00f3jrz na niego... Hej kole\u015b! Dobra robota z t\u0105 praw\u0105 stron\u0105. Nie obchodzi mnie, co m\u00f3wi obraz wyr\u00f3wnany do lewej, wygl\u0105dasz \u015bwietnie. Nie daj sobie wm\u00f3wi\u0107, \u017ce jest inaczej.<\/p>\n<p>Po chwili powiniene\u015b zobaczy\u0107, jak tekst zaczyna zawija\u0107 si\u0119 poni\u017cej wyr\u00f3wnanego do prawej obrazu i \u0142adnie si\u0119 uk\u0142ada\u0107. Powinno by\u0107 jeszcze du\u017co miejsca i wszystko powinno \u0142adnie wygl\u0105da\u0107. Tak... W\u0142a\u015bnie tak. Nigdy nie czu\u0142em si\u0119 tak dobrze, maj\u0105c racj\u0119.<\/p>\n<p>I to ju\u017c koniec, yo! Przetrwa\u0142e\u015b burzliwe wody wyr\u00f3wnania. Osi\u0105gni\u0119cie wyr\u00f3wnania obrazu odblokowane!<\/p>","protected":false},"excerpt":{"rendered":"<p>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&#8217;s get [&hellip;]<\/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\/pl\/wp-json\/wp\/v2\/pages\/1133"}],"collection":[{"href":"https:\/\/en.passengereye.com\/pl\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/en.passengereye.com\/pl\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/en.passengereye.com\/pl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/en.passengereye.com\/pl\/wp-json\/wp\/v2\/comments?post=1133"}],"version-history":[{"count":0,"href":"https:\/\/en.passengereye.com\/pl\/wp-json\/wp\/v2\/pages\/1133\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/en.passengereye.com\/pl\/wp-json\/wp\/v2\/pages\/12"}],"wp:attachment":[{"href":"https:\/\/en.passengereye.com\/pl\/wp-json\/wp\/v2\/media?parent=1133"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}