ฉันจะตั้งค่าเส้นขอบ CSS ด้านเดียวเท่านั้นได้อย่างไร

จะเห็นได้ว่าสร้างคอนเทนเนอร์สำเร็จแล้ว:

ขั้นตอนที่ 3: เข้าถึง div Container

ตอนนี้ เข้าถึงคอนเทนเนอร์ div ของ HTML และเข้าถึงชื่อคลาส ในการทำเช่นนั้น ตัวเลือกคลาส “ # ” ใช้กับชื่อคลาส

ขั้นตอนที่ 4: ใส่เส้นขอบด้านเดียวเท่านั้น

หลังจากเข้าถึงคอนเทนเนอร์ div ให้ใช้คุณสมบัติ CSS ที่กล่าวถึงด้านล่าง:

ที่นี่:

• • “ เส้นขอบซ้าย เป็นคุณสมบัติชวเลขสำหรับตั้งค่าความกว้าง สไตล์ และสีของเส้นขอบซ้าย
  • “ พื้นหลัง คุณสมบัติ ” ใช้สำหรับปรับสีพื้นหลังขององค์ประกอบ
  • “ ขอบ ” คุณสมบัติกำหนดพื้นที่นอกขอบเขต
  • “ ความกว้าง ” กำหนดขนาดความกว้างขององค์ประกอบในคอนเทนเนอร์

รูปภาพผลลัพธ์แสดงเส้นขอบที่มีด้านเดียวเท่านั้น:

วิธีที่ 2: กำหนดเส้นขอบทุกด้านด้วยสไตล์ที่แตกต่างกัน

หากต้องการกำหนดเส้นขอบทุกด้านด้วยสีต่างๆ ให้ใช้โค้ด HTML ด้านบน จากนั้น เข้าถึงคอนเทนเนอร์ div โดยใช้ชื่อรหัสและตัวเลือก:

ในรหัสที่ให้ไว้ด้านบน:

• • “ ขอบ ” ระบุพื้นที่ว่างภายนอกองค์ประกอบ
  • “ ความกว้างของเส้นขอบ ” ตั้งค่าความกว้างด้วยค่าที่แตกต่างกันสำหรับแต่ละด้าน ตัวอย่างเช่น เราได้เพิ่มค่าต่าง ๆ ในหน่วยพิกเซล
  • “ เส้นขอบรัศมี ” ใช้สำหรับทำขอบโค้งมน
  • “ สไตล์เส้นขอบ คุณสมบัติ ” ใช้สำหรับกำหนดรูปแบบของเส้นขอบ ในสถานการณ์สมมตินี้ สไตล์ที่แตกต่างกันสี่ประเภทถูกตั้งค่าสำหรับแต่ละด้านของเส้นขอบ
  • “ เส้นขอบสี คุณสมบัติ ” ใช้สำหรับจัดสรรสีให้กับเส้นขอบ ที่นี่ค่าสำหรับแต่ละด้านถูกกำหนดเป็นสีที่แตกต่างกัน

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

ในบทความนี้ คุณได้เรียนรู้วิธีต่างๆ ในการตั้งค่าเส้นขอบ CSS ด้านเดียวและหลายด้าน

บทสรุป

ในการกำหนดเส้นขอบด้านเดียวเท่านั้น ก่อนอื่นให้สร้าง div โดยใช้ปุ่ม “