สวัสดีชาว Gotoknow ทุกท่านนะคะ นี่เป็นบันทึกแรกที่ดิฉันเขียนที่ Gotoknow ค่ะ ซึ่งโดยปกติจะเขียนบันทึกอยู่ที่ learners.in.th ค่ะ สำหรับบันทึกแรกก็จะมาแนะนำเกี่ยวกับการตกแต่งบล็อกด้วยเส้นขอบแบบต่างๆ ค่ะ

เริ่มต้นด้วย code ของเส้นขอบ ที่จะเอาไปใส่ให้บล็อกก่อนเลยนะคะ

div#container {border: dashed 3px #FE517F}

ซึ่งประกอบไปด้วย ชนิดของเส้นขอบ ขนาด สี ค่ะ ทั้งสามส่วนสามารถเปลี่ยนแปลงได้ตามต้องการค่ะ

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

เรามาต่อกันที่ชนิดของเส้นขอบเลยนะคะ เราจะเขียน code css ไว้ก่อนนะคะ ถัดจาก code จะเป็นผลที่ได้ค่ะ

div#container {border: dashed}   - - - - - - - - - - -

div#container {border: dotted}  ........................

div#container {border: solid} __________

div#container {border: double} =========

เอามาแนะนำกันแค่ 4 แบบ นะคะ อยากดู code css ของเส้นขอบเพิ่มเติมก็เข้าไปที่เว็บ w3school ได้ตาม link เลยนี้ค่ะ css border มีแบบให้เลือกอีกเยอะแยะเลยค่ะ