ยินดีต้อนรับสู่การจัดตำแหน่งภาพ! หากคุณรู้จักโพสต์นี้, เป็นเพราะบล็อกเหล่านี้ถูกดัดแปลงมาจากคลาสสิก มาร์กอัป: การจัดตำแหน่งภาพ โพสต์. วิธีที่ดีที่สุดในการแสดงให้เห็นถึงการลดลงและการไหลของตัวเลือกการวางตำแหน่งภาพที่หลากหลายคือการวางไว้อย่างแนบเนียนท่ามกลางคำพูดมากมาย. จับไม้พายแล้วเริ่มกันเลย. อย่าลืมลองในโหมด RTL. ซ้ายควรอยู่ซ้ายและขวาควรอยู่ทางขวาสำหรับทิศทางการอ่านทั้งสอง.

ในหัวข้อการจัดตำแหน่ง, ควรสังเกตว่าผู้ใช้สามารถเลือกจากตัวเลือกของ ไม่มี, ซ้าย, ขวา, และ ศูนย์. หากธีมได้เพิ่มการสนับสนุนสำหรับ จัดแนวกว้าง, ภาพยังสามารถ กว้าง และ ความกว้างเต็ม. อย่าลืมทดสอบหน้านี้ในโหมด RTL.

นอกจากนี้, พวกเขายังได้รับตัวเลือกของขนาดภาพ 25%, 50%, 75%, 100% หรือความกว้างและความสูงที่ตั้งไว้.

ภาพด้านบนเกิดขึ้น อยู่ตรงกลาง.

ส่วนที่เหลือของย่อหน้านี้เป็นฟิลเลอร์เพื่อให้เห็นข้อความที่ล้อมรอบ 150×150 ภาพ, ซึ่งเป็น จัดชิดซ้าย.

อย่างที่คุณเห็นควรจะมีช่องว่างด้านบน, ด้านล่าง, และทางด้านขวาของภาพ. ข้อความไม่ควรเล็ดลอดบนรูปภาพ. การคืบคลานไม่ถูกต้อง. ภาพต้องมีห้องหายใจด้วย. ให้พวกเขาพูดเหมือนคุณเป็นคำพูด. ให้พวกเขาทำงานโดยไม่ต้องวุ่นวายกับข้อความ. อีกประมาณหนึ่งประโยคที่นี่, เราจะเห็นว่าข้อความเคลื่อนจากด้านขวาของรูปภาพลงมาด้านล่างของรูปภาพโดยไม่มีรอยต่อ. อีกครั้ง, ปล่อยให้มันเป็นทางเลือก. ภารกิจเสร็จสมบูรณ์!

และตอนนี้สำหรับ ภาพขนาดใหญ่จำนวนมาก. นอกจากนี้ยังมี ไม่มีการจัดตำแหน่ง.

ภาพด้านบน, แม้ว่าจะกว้าง 1200px, ไม่ควรล้นพื้นที่เนื้อหา. ควรมีอยู่โดยไม่มีการหยุดชะงักของการไหลของเนื้อหาที่มองเห็นได้.

และตอนนี้เรากำลังจะเปลี่ยนสิ่งต่างๆไปที่ จัดชิดขวา. อีกครั้ง, ควรมีที่ว่างด้านบน, ด้านล่าง, และทางด้านซ้ายของภาพ. แค่มองเขาตรงนั้น…เฮ้ผู้ชาย! วิธีที่จะโยกไปทางขวานั้น. ฉันไม่สนใจว่ารูปภาพที่จัดชิดซ้ายจะพูดว่าอย่างไร, คุณดูดี. อย่าปล่อยให้คนอื่นบอกคุณแตกต่างไปจากนี้.

เพียงเล็กน้อยที่นี่, คุณควรเห็นข้อความเริ่มห่อด้านล่างของภาพที่จัดชิดขวาและเข้ากันได้ดี. ยังควรมีที่ว่างอีกมากและทุกอย่างควรจะนั่งสวย. ใช่…ก็อย่างนั้น. มันไม่เคยรู้สึกดีขนาดนี้มาก่อน.

และเมื่อคุณคิดว่าเราทำเสร็จแล้ว, เราจะทำซ้ำอีกครั้งพร้อมคำอธิบายภาพ!

ภาพด้านบนเกิดขึ้น อยู่ตรงกลาง. คำบรรยายยังมีลิงก์อยู่ด้วย, เพียงเพื่อดูว่ามันทำอะไรที่ขี้ขลาดหรือไม่.

ส่วนที่เหลือของย่อหน้านี้เป็นฟิลเลอร์เพื่อให้เห็นข้อความที่ล้อมรอบ 150×150 ภาพ, ซึ่งเป็น จัดชิดซ้าย.

อย่างที่คุณเห็นควรจะมีช่องว่างด้านบน, ด้านล่าง, และทางด้านขวาของภาพ. ข้อความไม่ควรเล็ดลอดบนรูปภาพ. การคืบคลานไม่ถูกต้อง. ภาพต้องมีห้องหายใจด้วย. ให้พวกเขาพูดเหมือนคุณเป็นคำพูด. ให้พวกเขาทำงานโดยไม่ต้องวุ่นวายกับข้อความ. อีกประมาณหนึ่งประโยคที่นี่, เราจะเห็นว่าข้อความเคลื่อนจากด้านขวาของรูปภาพลงมาด้านล่างของรูปภาพโดยไม่มีรอยต่อ. อีกครั้ง, ปล่อยให้มันเป็นทางเลือก. ภารกิจเสร็จสมบูรณ์!

และตอนนี้สำหรับ ภาพขนาดใหญ่จำนวนมาก. นอกจากนี้ยังมี ไม่มีการจัดตำแหน่ง.

ภาพด้านบน, แม้ว่าจะกว้าง 1200px, ไม่ควรล้นพื้นที่เนื้อหา. ควรมีอยู่โดยไม่มีการหยุดชะงักของการไหลของเนื้อหาที่มองเห็นได้.

และตอนนี้เรากำลังจะเปลี่ยนสิ่งต่างๆไปที่ จัดชิดขวา. อีกครั้ง, ควรมีที่ว่างด้านบน, ด้านล่าง, และทางด้านซ้ายของภาพ. แค่มองเขาตรงนั้น…เฮ้ผู้ชาย! วิธีที่จะโยกไปทางขวานั้น. ฉันไม่สนใจว่ารูปภาพที่จัดชิดซ้ายจะพูดว่าอย่างไร, คุณดูดี. อย่าปล่อยให้คนอื่นบอกคุณแตกต่างไปจากนี้.

เพียงเล็กน้อยที่นี่, คุณควรเห็นข้อความเริ่มห่อด้านล่างของภาพที่จัดชิดขวาและเข้ากันได้ดี. ยังควรมีที่ว่างอีกมากและทุกอย่างควรจะนั่งสวย. ใช่…ก็อย่างนั้น. มันไม่เคยรู้สึกดีขนาดนี้มาก่อน.

ลองนึกภาพว่าเราจะพบการใช้งานสำหรับภาพกว้างพิเศษ! ภาพนี้มีไฟล์ กว้าง การจัดตำแหน่ง:

เราไปใหญ่กว่านี้ได้ไหม? ภาพนี้มีไฟล์ ความกว้างเต็ม การจัดตำแหน่ง:

และนั่นคือการสรุป, ผม! คุณรอดชีวิตจากน้ำที่ไหลเชี่ยวของการจัดตำแหน่ง. ปลดล็อกความสำเร็จในการจัดตำแหน่งภาพแล้ว! สิ่งสุดท้าย: รายการสุดท้ายในเนื้อหาของโพสต์นี้คือภาพขนาดย่อที่ลอยอยู่ทางขวา. ตรวจสอบให้แน่ใจว่าองค์ประกอบใด ๆ หลังจากล้างเนื้อหาอย่างถูกต้องแล้ว.