{"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\/cs\/features\/page-image-alignment\/","title":{"rendered":"Zarovn\u00e1n\u00ed obr\u00e1zk\u016f na str\u00e1nce"},"content":{"rendered":"<p>V\u00edtejte u zarovn\u00e1n\u00ed obr\u00e1zk\u016f! Nejlep\u0161\u00ed zp\u016fsob, jak demonstrovat p\u0159\u00edliv a odliv r\u016fzn\u00fdch mo\u017enost\u00ed um\u00edst\u011bn\u00ed obr\u00e1zk\u016f, je um\u00edstit je do oce\u00e1nu slov. Vezm\u011bte si p\u00e1dlo a za\u010dn\u011bme.<\/p>\n<p>K t\u00e9matu zarovn\u00e1n\u00ed je t\u0159eba poznamenat, \u017ee u\u017eivatel\u00e9 si mohou vybrat z mo\u017enost\u00ed\u00a0<em>\u017d\u00e1dn\u00e9<\/em>,\u00a0<em>Vlevo<\/em>,\u00a0<em>Vpravo, <\/em>a\u00a0<em>St\u0159edisko<\/em>. Krom\u011b toho maj\u00ed tak\u00e9 mo\u017enost\u00a0<em>Miniatury<\/em>,\u00a0<em>St\u0159edn\u00ed<\/em>,\u00a0<em>Velk\u00e9<\/em>\u00a0&amp;\u00a0<em>Pln\u00e1 velikost<\/em>.<\/p>\n<p style=\"text-align:center;\"><img loading=\"lazy\" class=\"size-full wp-image-906 aligncenter\" title=\"Vyrovn\u00e1n\u00ed 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>V\u00fd\u0161e uveden\u00fd obr\u00e1zek je\u00a0<em><strong>vycentrovan\u00e9<\/strong><\/em>.<\/p>\n<p><strong><img loading=\"lazy\" class=\"size-full wp-image-904 alignleft\" title=\"Zarovn\u00e1n\u00ed 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>Zbytek tohoto odstavce je v\u00fdpl\u0148ov\u00fd, aby bylo vid\u011bt, jak se text obt\u00e9k\u00e1 kolem obr\u00e1zku 150\u00d7150, kter\u00fd je. <em><strong>zarovn\u00e1n\u00ed vlevo<\/strong><\/em>.\u00a0<strong><\/strong><\/p>\n<p>Jak vid\u00edte, nad, pod a vpravo od obr\u00e1zku by m\u011bl b\u00fdt prostor. Text by se nem\u011bl do obr\u00e1zku vpl\u00ed\u017eit. Pl\u00ed\u017een\u00ed prost\u011b nen\u00ed spr\u00e1vn\u00e9. I obr\u00e1zky pot\u0159ebuj\u00ed prostor pro d\u00fdch\u00e1n\u00ed. Nechte je mluvit stejn\u011b jako vy slova. Nechte je d\u011blat jejich pr\u00e1ci bez jak\u00e9hokoli obt\u011b\u017eov\u00e1n\u00ed textem. Je\u0161t\u011b asi jedna v\u011bta zde, uvid\u00edme, \u017ee se text p\u0159esune z prav\u00e9 strany obr\u00e1zku dol\u016f pod obr\u00e1zek v plynul\u00e9m p\u0159echodu. Op\u011bt nechte text d\u011blat svou pr\u00e1ci. Mise spln\u011bna!<\/p>\n<p>A nyn\u00ed k <em><strong>masivn\u011b velk\u00fd obr\u00e1zek<\/strong><\/em>. M\u00e1 tak\u00e9 <em><strong>\u017e\u00e1dn\u00e9 zarovn\u00e1n\u00ed<\/strong><\/em>.<\/p>\n<p><img loading=\"lazy\" class=\"alignnone  wp-image-907\" title=\"Vyrovn\u00e1n\u00ed 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>V\u00fd\u0161e uveden\u00fd obr\u00e1zek, a\u010dkoli je \u0161irok\u00fd 1200px, by nem\u011bl p\u0159et\u00e9kat p\u0159es oblast obsahu. M\u011bl by z\u016fstat uzav\u0159en\u00fd, ani\u017e by viditeln\u011b naru\u0161oval tok obsahu.<\/p>\n<p><img loading=\"lazy\" class=\"size-full wp-image-905 alignright\" title=\"Vyrovn\u00e1n\u00ed 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 nyn\u00ed se p\u0159esuneme k t\u00e9matu <em><strong>zarovn\u00e1n\u00ed doprava<\/strong><\/em>. Op\u011bt by m\u011bl b\u00fdt dostatek m\u00edsta nad, pod a vlevo od obr\u00e1zku. Jen se na n\u011bj pod\u00edvejte... Hej, chlape! Takhle to na t\u00e9 prav\u00e9 stran\u011b rozbalit. Je mi jedno, co \u0159\u00edk\u00e1 obr\u00e1zek zarovnan\u00fd vlevo, vypad\u00e1\u0161 skv\u011ble. A\u0165 ti nikdo ne\u0159\u00edk\u00e1 n\u011bco jin\u00e9ho.<\/p>\n<p>Za chv\u00edli byste m\u011bli vid\u011bt, \u017ee se text za\u010d\u00edn\u00e1 obt\u00e9kat pod prav\u00fdm zarovnan\u00fdm obr\u00e1zkem a p\u011bkn\u011b se usazuje. St\u00e1le by m\u011blo b\u00fdt dost m\u00edsta a v\u0161e by m\u011blo b\u00fdt p\u011bkn\u011b na sv\u00e9m m\u00edst\u011b. Ano... p\u0159esn\u011b tak. Je\u0161t\u011b nikdy nebylo tak p\u0159\u00edjemn\u00e9 m\u00edt pravdu.<\/p>\n<p>A kdy\u017e u\u017e jste si mysleli, \u017ee jsme skon\u010dili, ud\u011bl\u00e1me je v\u0161echny znovu s titulky!<\/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=\"Vyrovn\u00e1n\u00ed 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\">Pod\u00edvejte se na 580\u00d7300 a z\u00edskejte n\u011bjak\u00e9 <a title=\"Nastaven\u00ed obr\u00e1zk\u016f\" href=\"http:\/\/en.support.wordpress.com\/images\/image-settings\/\">titulek<\/a> l\u00e1ska.<\/p><\/div>\n<p>V\u00fd\u0161e uveden\u00fd obr\u00e1zek je\u00a0<em><strong>vycentrovan\u00e9<\/strong><\/em>. V nadpisu je tak\u00e9 odkaz, jen abych zjistil, jestli to d\u011bl\u00e1 n\u011bco divn\u00e9ho.<\/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=\"Zarovn\u00e1n\u00ed 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\">Malink\u00fd titulek.<\/p><\/div>\n<p><strong><\/strong>Zbytek tohoto odstavce je v\u00fdpl\u0148ov\u00fd, aby bylo vid\u011bt, jak se text obt\u00e9k\u00e1 kolem obr\u00e1zku 150\u00d7150, kter\u00fd je. <em><strong>zarovn\u00e1n\u00ed vlevo<\/strong><\/em>.\u00a0<strong><\/strong><\/p>\n<p>Jak vid\u00edte, nad, pod a vpravo od obr\u00e1zku by m\u011bl b\u00fdt prostor. Text by se nem\u011bl do obr\u00e1zku vpl\u00ed\u017eit. Pl\u00ed\u017een\u00ed prost\u011b nen\u00ed spr\u00e1vn\u00e9. I obr\u00e1zky pot\u0159ebuj\u00ed prostor pro d\u00fdch\u00e1n\u00ed. Nechte je mluvit stejn\u011b jako vy slova. Nechte je d\u011blat jejich pr\u00e1ci bez jak\u00e9hokoli obt\u011b\u017eov\u00e1n\u00ed textem. Je\u0161t\u011b asi jedna v\u011bta zde, uvid\u00edme, \u017ee se text p\u0159esune z prav\u00e9 strany obr\u00e1zku dol\u016f pod obr\u00e1zek v plynul\u00e9m p\u0159echodu. Op\u011bt nechte text d\u011blat svou pr\u00e1ci. Mise spln\u011bna!<\/p>\n<p>A nyn\u00ed k <em><strong>masivn\u011b velk\u00fd obr\u00e1zek<\/strong><\/em>. M\u00e1 tak\u00e9 <em><strong>\u017e\u00e1dn\u00e9 zarovn\u00e1n\u00ed<\/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=\"Vyrovn\u00e1n\u00ed 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\">Masivn\u00ed koment\u00e1\u0159 k obr\u00e1zku pro va\u0161e o\u010dn\u00ed bulvy.<\/p><\/div>\n<p>V\u00fd\u0161e uveden\u00fd obr\u00e1zek, a\u010dkoli je \u0161irok\u00fd 1200px, by nem\u011bl p\u0159et\u00e9kat p\u0159es oblast obsahu. M\u011bl by z\u016fstat uzav\u0159en\u00fd, ani\u017e by viditeln\u011b naru\u0161oval tok obsahu.<\/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=\"Vyrovn\u00e1n\u00ed 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\">Je p\u0159\u00edjemn\u00e9 m\u00edt st\u00e1le pravdu.<\/p><\/div>\n<p>A nyn\u00ed se p\u0159esuneme k t\u00e9matu <em><strong>zarovn\u00e1n\u00ed doprava<\/strong><\/em>. Op\u011bt by m\u011bl b\u00fdt dostatek m\u00edsta nad, pod a vlevo od obr\u00e1zku. Jen se na n\u011bj pod\u00edvejte... Hej, chlape! Takhle to na t\u00e9 prav\u00e9 stran\u011b rozbalit. Je mi jedno, co \u0159\u00edk\u00e1 obr\u00e1zek zarovnan\u00fd vlevo, vypad\u00e1\u0161 skv\u011ble. A\u0165 ti nikdo ne\u0159\u00edk\u00e1 n\u011bco jin\u00e9ho.<\/p>\n<p>Za chv\u00edli byste m\u011bli vid\u011bt, \u017ee se text za\u010d\u00edn\u00e1 obt\u00e9kat pod prav\u00fdm zarovnan\u00fdm obr\u00e1zkem a p\u011bkn\u011b se usazuje. St\u00e1le by m\u011blo b\u00fdt dost m\u00edsta a v\u0161e by m\u011blo b\u00fdt p\u011bkn\u011b na sv\u00e9m m\u00edst\u011b. Ano... p\u0159esn\u011b tak. Je\u0161t\u011b nikdy nebylo tak p\u0159\u00edjemn\u00e9 m\u00edt pravdu.<\/p>\n<p>A to je v\u0161e! P\u0159e\u017eili jste bou\u0159liv\u00e9 vody vyrovn\u00e1v\u00e1n\u00ed. \u00dasp\u011bch zarovn\u00e1n\u00ed obr\u00e1zk\u016f je odem\u010den!<\/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\/cs\/wp-json\/wp\/v2\/pages\/1133"}],"collection":[{"href":"https:\/\/en.passengereye.com\/cs\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/en.passengereye.com\/cs\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/en.passengereye.com\/cs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/en.passengereye.com\/cs\/wp-json\/wp\/v2\/comments?post=1133"}],"version-history":[{"count":0,"href":"https:\/\/en.passengereye.com\/cs\/wp-json\/wp\/v2\/pages\/1133\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/en.passengereye.com\/cs\/wp-json\/wp\/v2\/pages\/12"}],"wp:attachment":[{"href":"https:\/\/en.passengereye.com\/cs\/wp-json\/wp\/v2\/media?parent=1133"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}