โค้ด ที่ทำหน้าสินค้าของ astore ให้เป็นกรอปสี่เหลี่ยมทำไงอะครับ
Friday, April 10, 2009 by GooRoo
โค้ดการทำหน้าสินค้าของ aStore ให้เป็นกรอบสี่เหลี่ยมที่ว่าหมายถึงแบบนี้หรือเปล่า
คือการแสดงสินค้าขึ้นมา จะมีกรอบสี่เหลี่ยมล้อมรอบรูปสินค้า เมื่อเอาเม้าส์ไปชี้จะเปลี่ยนสีกรอบ
ถ้าต้องการอย่างนี้ ให้เอาโค้ดนี้ไปใส่ใน Overriding CSS ของ aStore ในส่วนของแถบ Category Page
table.products tr.imagerow td {
vertical-align:bottom;
text-align: center; /* กำหนดตำแหน่งการแสดงรูปภาพสินค้าให้อยู่ตรงกลางของกรอบสี่เหลี่ยม */
}
table.products tr.imagerow td a {
border: 2px solid #FFEEEE; /* กำหนดขนาดกรอบ 2px, ลักษณะเส้นทึบ และสีของกรอบชมพูอ่อน */
display: block;
margin: 0px;
height: 125px;
}
table.products tr.imagerow td a:hover {
border: 1px solid #FFAAFF; /* เมื่อเอาเม้าส์มาชี้ในกรอบ กำหนดขนาดกรอบ 1px, ลักษณะเส้นทึบ และสีของกรอบชมพูเข้ม */
}
(บทความจาก www.thaisem.com เขียนโดยคุณ P@^_^@K)
คือการแสดงสินค้าขึ้นมา จะมีกรอบสี่เหลี่ยมล้อมรอบรูปสินค้า เมื่อเอาเม้าส์ไปชี้จะเปลี่ยนสีกรอบ
ถ้าต้องการอย่างนี้ ให้เอาโค้ดนี้ไปใส่ใน Overriding CSS ของ aStore ในส่วนของแถบ Category Page
table.products tr.imagerow td {
vertical-align:bottom;
text-align: center; /* กำหนดตำแหน่งการแสดงรูปภาพสินค้าให้อยู่ตรงกลางของกรอบสี่เหลี่ยม */
}
table.products tr.imagerow td a {
border: 2px solid #FFEEEE; /* กำหนดขนาดกรอบ 2px, ลักษณะเส้นทึบ และสีของกรอบชมพูอ่อน */
display: block;
margin: 0px;
height: 125px;
}
table.products tr.imagerow td a:hover {
border: 1px solid #FFAAFF; /* เมื่อเอาเม้าส์มาชี้ในกรอบ กำหนดขนาดกรอบ 1px, ลักษณะเส้นทึบ และสีของกรอบชมพูเข้ม */
}
(บทความจาก www.thaisem.com เขียนโดยคุณ P@^_^@K)
