ถามหน่อยสิครับ ทำ responsive เว็บ แล้วทำไงให้รูปภาพได้สัดส่วน

[Beboyzo]

คือ  theme ของ WordPress นะครับ เวลาโหมดโทรศัพท รูปภาพออกมาเน่า มาก เราจะเขียนโค้ดอะไร ทำให้มันออกมาหล่อๆบ่างไหมครับ

[VadiForte]

กำหนดเฉพาะ ความกว้าง หรือความสูง อย่างไดอย่างหนึ่งครับ

ถ้ากำหนดทั้ง 2 อย่างมันจะไม่สวย

หรือไม่ก็ใส่เป็น Max-heigth , Max-width ก็ได้ครับ

[josephsrawut]

แบบนี้ก็ได้ครับ ...

<img src="picture.jpg" style="max-width: 100%; height: auto;">

[Beboyzo]

ขอบคุณครับ ถามเพิ่มเติมอีกนิดนะครับ มันมี Code แบบตัดรูปให้ได้ขนาดไหมครับ แบบว่า พอ ขนาดหน้าจอ 320px ให้ ครอบภาพ ให้เหลือ 320px เหมือนกันอะไรประมาณนี้อ่ะครับ

[josephsrawut]

ขอบคุณครับ ถามเพิ่มเติมอีกนิดนะครับ มันมี Code แบบตัดรูปให้ได้ขนาดไหมครับ แบบว่า พอ ขนาดหน้าจอ 320px ให้ ครอบภาพ ให้เหลือ 320px เหมือนกันอะไรประมาณนี้อ่ะครับ

แบบนี้หรือเปล่าครับ ....

https://wordpress.org/plugins/manual-image-crop

แต่ผมไม่เคยใช้นะครับ

[sys2528]

ขอบคุณครับ ถามเพิ่มเติมอีกนิดนะครับ มันมี Code แบบตัดรูปให้ได้ขนาดไหมครับ แบบว่า พอ ขนาดหน้าจอ 320px ให้ ครอบภาพ ให้เหลือ 320px เหมือนกันอะไรประมาณนี้อ่ะครับ

แบบนี้หรือเปล่าครับ ....

https://wordpress.org/plugins/manual-image-crop

แต่ผมไม่เคยใช้นะครับ

อันนี้ก็ดูน่าใช้นะครับ

[chhopster]

โค้ด เลือก ขยาย

@media only screen and (max-device-width: 320px) {
    img{
         max-width : 320px;
         height : auto; 
}
}

ลองประมาณนี้ครับ

[esanza.com]

ขอบคุณครับ ถามเพิ่มเติมอีกนิดนะครับ มันมี Code แบบตัดรูปให้ได้ขนาดไหมครับ แบบว่า พอ ขนาดหน้าจอ 320px ให้ ครอบภาพ ให้เหลือ 320px เหมือนกันอะไรประมาณนี้อ่ะครับ

โค้ด เลือก ขยาย

<style media="all">
img{
max-width:320px;
overflow:hidden;
}
</style>

ลองปรับใช้ดูนะครับ 

[Beboyzo]

ขอบคุณทุกคนนะครับ ตอนนี้ ภาพ หล่อขึ้นเยอะ

[ShizzK]

ผมใช้ theme ของ genesis ที่เป็น responsive อะครับ ไม่รู้ว่ารูปภาพพวกนี้มันจะโอเคไหม

แล้วเราเอาโค๊ดที่แนะนำมาไปใส่ตรงไหนเหรอครับ เพื่อให้รูปภาพทั้งหมดแสดงออกมาสวยงามครับ

[Beboyzo]

ผมใช้ theme ของ genesis ที่เป็น responsive อะครับ ไม่รู้ว่ารูปภาพพวกนี้มันจะโอเคไหม

แล้วเราเอาโค๊ดที่แนะนำมาไปใส่ตรงไหนเหรอครับ เพื่อให้รูปภาพทั้งหมดแสดงออกมาสวยงามครับ

ผมคิดว่า Theme ที่เค้าออกมาขาย น่าจะออกแบบพวกรูปภาพมาในระดับ หนึ่งแล้วนะครับ ส่วนโค๊ดจะเอาไป แป๊ะที่ ไฟล์ style.css ครับป๋ม