ABOUT PADDING AND BORDER

 

1

ABOUT

PADDING



PADDING คือ ระยะห่างของ container กับ content (กรอบของกริดในแต่ละช่อง กับเนื้อหาที่ใส่เข้าไป ไม่ว่าจะเป็นรูปภาพ หรือตัวอักษร)

PADDING มีไว้กำหนดระยะให้เนื้อหาห่างจากกรอบต่างๆ แต่ไม่ทำให้กรอบเปลี่ยนขนาด สามารถกำหนดให้ทุกด้านเท่าหรือไม่เท่าได้ 



ค่าตั้งต้นของ PADDING ในทุกกรอบ Container = 15 พิกเซล ทุกด้าน


start to site


ใส่รูปลงในทุกที่ 

รูปจะไม่เต็มกรอบ

เพราะมี padding=15px

หากต้องการให้รูปแสดงเต็มกรอบ 

ให้ไปเปลี่ยน padding=0


start to site

start to site


PADDING FOR CONTAINER


ใส่รูปมีค่าเริ่มต้น default padding = 15px ทุกด้าน 

สามารถเปลี่ยนได้ หากต้องการให้รูปหรือเนื้อหาเต็มใน container 

ให้เลือก padding = 0px ทุกด้าน


padding ในแต่ละกรอบ container มีค่าได้เพียงหนึ่งชุด

 หากปรับให้รูปมี padding =0 ตัวอักษรก็จะเป็นเช่นเดียวกัน

 หากต้องการรูปเต็มกรอบ แต่ตัวอักษรไม่เต็ม

ให้แยกกันใส่ในแต่ละ brick




กำหนด padding=0 ทุกด้าน


start to site


ตัวอย่างด้านบน

รูปมี padding = 15 พิกเซล 

ใส่ Border ให้คอลัมน์เป็นสีขาว

ใส่สีอัลฟ้าลงในคอลัมน์เพื่อเน้นตัวอักษร

 ตัวอย่างด้านบน

รูปมี padding = 15 พิกเซล 

ใส่สีอัลฟ่าให้คอลัมน์แถวบนเป็นสีขาว

ใส่สีอัลฟ้าลงในคอลัมน์ล่างเข้มเพื่อเน้นตัวอักษร

 

เลือกกริด 3 คอลัมน์

เลือก Mobile กริดจะอยู่ตามที่เลือกไว้ไม่เลื่อนลงเมื่อจอเล็กลง

เลือก padding=5px เพื่อให้ช่องไฟเล็กลง

2

ABOUT

BORDER 

เลือกสไตล์ ขนาด สี ของ Border ในทุกคอลัมน์



SAMPLE

 





SAMPLE


เพิ่ม border เป็นกรอบให้ background 


ใส่รูปเพื่อเป็นพื้นหลังของคอลัมน์ 

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







SAMPLE


เพิ่ม border เป็นกรอบให้ background 

BORDER STYLE


สามารถใส่ Border ได้หลายแบบ

ทั้งใน Column Block และ  Brick

เลือก รูปแบบ สี กำหนดขนาด ได้




FLOWER


สร้างเว็บไซต์ให้ร้านค้า และบริการ

ปรับเปลี่ยนได้ทุกวัน

รับส่งดอกไม้สด ดอกไม้แห้ง 24 ชั่วโมง