## ใครเก่ง CSS ช่วยผมหน่อยครับผมจะ Fix ขนาด +1

[adjobb]

เว็บนี้ครับ http://seesai.com

1.ผมต้องการเพิ่ม css ที่เวลาสินค้าไม่มีรูปก็จะใส่รูปที่เราตั้งไว้แทน เราจะใช้คำสั่งไหนครับ
2.มีวิธีไหนที่ fix ให้ขนาดคอลั่มสินค้าเท่ากันมั้งครับ มันเบี้ยวเวลาหัวข้อยาว ปรับขนาดแทนได้ไหม เพราะเท่าที่ดู มันเหมือน auto

ขอบคุณครับ + ทุกความคิดเห็น

[ปลวกจุติ]

เหมือนว่ามันเป็นเว็บ responsive นะครับ ขนาดจะ ปรับตามขนาดจอ
ถ้าจะกำหนดความกว้างตายตัวเลยคงต้องปรับ css ใส่ประมาณนี้

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


width : 200px;
height : 150px;


---------------------

กำหนดว่าสินค้ามีรูปหรือไม่มีรูปคงต้องเขียนตรวจสอบเองอะครับ
if(ถ้ามีรูปสินค้า){
ใส่รูปสินค้า
}else{
ใส่รูปที่เรากำหนดเอง
}

[konpunzaa]

ข้อ 2.
max-width:xxx px

[smapan]

ผมเข้าไปดูที่เว็บแล้ว พบว่าเวลาไม่มีรูประบบจะมีการแสดงโค้ดนี้ออกมา
<img src="" alt="">

ท่านพอจะเขียนโค้ดได้มั้ยครับว่าถ้าไม่มีรู้ให้ ใส่ภาพแสดงข้อความคำว่าไม่มีรูปแทนครับ

แล้วเรื่องความสูงของ สินค้า ผมแนะนำแบบง่ายสุดคือ
กำหนดความสูงของ ทุกส่วนในหน้าจอเลยครับ
ถ้าอะไรเลยก็ให้ซ่อน ครับ แบบนี้จะง่ายสุดครับ
แต่ถ้าอยากจะได้ แบบเหนือกว่านั้นก้ต้องใช้ java script เข้าช่วยครับ

[kenessar]

ถ้าเป็นรูปในเว็บตัวเอง ผมแนะนำโค้ดแบบด้านบนแหละครับ
แต่ถ้าเป็นรูปจากโฮสอื่น เว็บอื่น

ลองแบบนี้ก็ได้ครับ <img src="xxxx1" onerror="this.src='xxxx2';" />

xxxx1 เป็น URL หารูปจริง
xxxx2 เป็น URL หารูปสำรอง

แต่ก็ไม่ค่อยแนะนำวิธีนี้เท่าไหร่ โค้ดมันจะรก ขนาดไฟล์ก็จะใหญ่ขึ้นด้วย  ยกเว้นท่านจะใช้ไม่กี่จุด ส่วนมากผมจะใช้กันเหนียว
กรณีนี้ใช้สำหรับการตรวจรูปจากเว็บอื่น จะใช้วิธีนี้ตรวจสอบลิ้งค์เสียได้ (จะใช้กับ url หารูปในเว็บตัวเองก็ได้เช่นกัน)

ถ้าตรวจรูปในเว็บตัวเองใช้คำสั่ง php ตรวจครับ แต่ถ้าท่านจำเป็นต้องตรวจว่ารูปเนี่ย (url จากเว็บอื่น) ไม่มีอยู่จริงหรือลิ้งค์เสีย ค่อยเอารูปสำรองมาใช้ (ที่เก็บในโฮสท่าน)
ถ้าท่านเขียนโค้ดไม่เป็นเลย แต่พอแก้ HTML ได้ วิธีนี้อาจจะเหมาะกับท่าน

[pollok]

1. ต้องเขียน code if else ครับ
2. css กำหนด height  และ overflow:hidden ลงไปครับ เท่าที่ดูปัญหาน่าจะเป็นเพราะขนาด title ไม่เท่ากัน แนะนำให้กำหนดความสูง(css:height+overflow)หรือจำกัดคำลงไป(PHP) ก็จะเท่ากันทุกบล็อคเองครับ

[MD.18]

กล่องหลัก .thumbnail{display:block;padding:4px;height:420px;line-height:20px;border:2px solid #ddd;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.055);-moz-box-shadow:0 1px 3px rgba(0,0,0,0.055);box-shadow:0 1px 3px rgba(0,0,0,0.055);-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out}

ตรงรูป .thumbnail>img{display:block;max-width:100%;height:270px;margin-right:auto;margin-left:auto}

ใส่ตครงกลางให้กล่อง .thumbnail .caption{padding:9px;color:#555;text-align:center}

ตรง h6 ใส่ขนาดความสูงเข้าไป   h6{margin:10px 0;min-height:60px;....}

//// สีแดงที่ขีดเส้นใต้คือที่เพิ่มไป

ส่วนโค๊ดถ้าไม่มีรูปให้แสดงรูปที่เตรียมไว้คงต้องเป็น php ช่วยหรือป่าว หรือถ้าจะเอาแบบง่าย ๆ ก็ใส่พื้นหลังเป็นรูปให้ที่กลอ่งwไว้เลยถ้าไม่มีรูปก็จะเห้นพื้นหลังเป็นรูปที่เราเตรียมไว้ ถ้ามีรูปก็จะทับพื้นหลัง

.thumbnail>img{display:block;max-width:100%;height:270px;margin-right:auto;margin-left:auto;background:#fff url("ที่อยู่รูป/testimage.png")no-repeat center center}

ไม่รู้ได้หรือป่าวนะ  เน้นเอาแบบแก้ขัดไปก่อนอาจจะไม่มืออาชีพครับ