1. Home
  2. CSS ชายแดน (พรมแดน)

บทช่วยสอน CSS ชายแดน (พรมแดน) ที่ดีที่สุดในปี 2024 ในบทช่วยสอนนี้ คุณสามารถเรียนรู้ คุณสมบัติ CSS ชายแดน,ลักษณะเส้นขอบ,ค่าชายแดนสไตล์:,ความกว้างชายแดน,ตัวอย่าง,สีของเส้นขอบ,ตัวอย่าง,ชายแดน - การตั้งค่าที่แยกต่างหากสำหรับแต่ละด้าน,ตัวอย่าง,ตัวอย่าง,ชายแดน - ทรัพย์สินจดชวเลข,ตัวอย่าง,ตัวอย่างเพิ่มเติม,คุณสมบัติ CSS ชายแดน,

CSS ชายแดน (พรมแดน)

คุณสมบัติ CSS ชายแดน

คุณสมบัติชายแดน CSS ช่วยให้คุณสามารถระบุลักษณะเส้นขอบองค์ประกอบและสี

ลักษณะเส้นขอบ

โรงแรมสไตล์ชายแดนระบุสิ่งที่ชนิดของเส้นขอบที่จะแสดง

คำพูดคุณสมบัติชายแดนสไตล์จะใช้ในการกำหนดรูปแบบของเส้นขอบ

ค่าชายแดนสไตล์:

ไม่มี: ไม่มีพรมแดนเริ่มต้น

จุด: ด่างดวง: กำหนดปะรำ

ประ: กำหนดกล่องประ

ของแข็ง: ความหมายของเส้นขอบที่เป็นของแข็ง

คู่: กำหนดขอบเขตสอง ค่าเดียวกันของความกว้างสองชายแดนและชายแดนความกว้างของ

ร่อง: ร่องชายแดน 3D ที่กำหนดไว้ ผลกระทบที่เกิดขึ้นอยู่กับค่าสีของขอบเขต

สัน: นิยาม 3D ชายแดนสันเขา ผลกระทบที่เกิดขึ้นอยู่กับค่าสีของขอบเขต

ภาพประกอบ: กำหนดพรมแดน 3D ฝังตัว ผลกระทบที่เกิดขึ้นอยู่กับค่าสีของขอบเขต

เริ่มแรก: กำหนดเส้นขอบเริ่มแรก 3D ผลกระทบที่เกิดขึ้นอยู่กับค่าสีของขอบเขต

ลองดู: ตั้งสไตล์ชายแดน

ความกว้างชายแดน

คุณสามารถระบุความกว้างของเส้นขอบโดยแอตทริบิวต์ชายแดนที่มีความกว้าง

ระบุความกว้างชายแดนในสองวิธี: คุณสามารถระบุความยาวของค่าเช่น 2px หรือ 0.1em หรือใช้หนึ่งในสามคำซึ่งมีบางกลาง (เริ่มต้น) และหนา

หมายเหตุ: CSS ไม่ได้กำหนดความกว้างสามคำที่เฉพาะเจาะจงเพื่อเป็นตัวแทนของผู้ใช้อาจจะเป็นบางกลางและหนาตามลำดับตั้งค่าเท่ากับ 5px, 3px และ 2px ขณะที่ตัวแทนของผู้ใช้อีกตามลำดับกำหนดให้ 3px, 2px และ 1px

ตัวอย่าง

p.one
{
border-style:solid;
border-width:5px;
}
p.two
{
border-style:solid;
border-width:medium;
}

ลอง»

สีของเส้นขอบ

คุณสมบัติชายแดนสีตั้งค่าสีของเส้นขอบ คุณสามารถตั้งค่าสี:

  • ชื่อ - ระบุชื่อของสีเช่น "สีแดง"
  • RGB - ระบุค่า RGB เช่น "rgb (255,0,0)"
  • Hex - ระบุค่าฐานสิบหกเช่น "# FF0000"

นอกจากนี้คุณยังสามารถตั้งค่าสีของเส้นขอบที่ "โปร่งใส"

หมายเหตุ: ขอบสีเพียงอย่างเดียวไม่ได้ผลคุณต้องมีเพื่อใช้ชายแดนสไตล์ในการตั้งค่าสไตล์ชายแดน

ตัวอย่าง

p.one
{
ชายแดนสไตล์: ของแข็ง
ชายแดนสี: สีแดง;
}
p.two
{
ชายแดนสไตล์: ของแข็ง
border-color: # 98bf21;
}

ลอง»

ชายแดน - การตั้งค่าที่แยกต่างหากสำหรับแต่ละด้าน

ใน CSS คุณสามารถระบุพรมแดนด้านที่แตกต่างที่แตกต่างกัน

ตัวอย่าง

p
{
border-top-style:dotted;
border-right-style:solid;
border-bottom-style:dotted;
border-left-style:solid;
}

ลอง»

ตัวอย่างข้างต้นยังสามารถตั้งค่าแอตทริบิวต์เดียว:

ตัวอย่าง

border-style:dotted solid;

ลอง»

คุณสมบัติชายแดนสไตล์สามารถมี 1-4 ค่า:

  • ชายแดนสไตล์: ด่างดวงคู่ที่มั่นคงประ ;
    • ชายแดนเป็นจุด
    • เส้นขอบด้านขวาเป็นของแข็ง
    • ชายแดนคู่ล่าง
    • ขอบซ้ายเป็นประ

  • ชายแดนสไตล์: จุดแข็งคู่
    • ชายแดนเป็นจุด
    • ซ้ายและขอบด้านขวาเป็นของแข็ง
    • ชายแดนคู่ล่าง

  • ชายแดนสไตล์: จุดแข็ง
    • ด้านล่างเป็นชายแดนประ
    • เส้นขอบซ้ายและขวาเป็นของแข็ง

  • ชายแดนสไตล์: ด่างดวง;
    • ล้อมรอบด้วยชายแดนประ

ตัวอย่างข้างต้นใช้ชายแดนสไตล์ แต่ก็ยังสามารถเป็นชายแดนที่มีความกว้างขอบสีด้วยกัน

ชายแดน - ทรัพย์สินจดชวเลข

ตัวอย่างข้างต้นใช้จำนวนมากของคุณสมบัติการตั้งชายแดน

T นอกจากนี้คุณยังสามารถตั้งค่าชายแดนในคุณสมบัติ

คุณสามารถ "ชายแดน" แอตทริบิวต์ตั้ง:

  • ชายแดนที่มีความกว้าง
  • ชายแดนสไตล์ (จำเป็น)
  • ชายแดนสี

ตัวอย่าง

border:5px solid red;

ลอง»

ตัวอย่าง

ตัวอย่างเพิ่มเติม

ทั้งหมดคุณสมบัติชายแดนในการประกาศเป็น
ตัวอย่างนี้แสดงให้เห็นถึงคุณสมบัติที่จดชวเลขการตั้งค่าทั้งหมดคุณสมบัติชายแดนสี่ในคำสั่งเดียวกัน

การตั้งค่าสไตล์ชายแดน
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการตั้งค่ารูปแบบของชายแดนด้านล่าง

การตั้งค่าความกว้างของเส้นขอบด้านซ้าย
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการที่จะกำหนดความกว้างของเส้นขอบด้านซ้าย

ตั้งค่าสีของเส้นขอบทั้งสี่
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการตั้งค่าสีของเส้นขอบทั้งสี่ คุณสามารถตั้งค่า 1-4 สี

การตั้งค่าสีของเส้นขอบด้านขวา
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการตั้งค่าสีของเส้นขอบด้านขวา

คุณสมบัติ CSS ชายแดน

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

บทแนะนำยอดนิยม

Contact US

CSS ชายแดน (พรมแดน)
10/30