วิธีกำหนดเส้นขอบสำหรับแท็ก div HTML

ฉันพยายามกำหนดเส้นขอบรอบ ๆ แท็ก div ใน HTML ในบางเบราว์เซอร์เส้นขอบจะไม่ปรากฏขึ้น

นี่คือรหัส HTML ของฉัน:

<div id="divActivites" name="divActivites" style="border:thin">
    <textarea id="inActivities" name="inActivities" style="border:solid">
    </textarea> 
</div> 

ฉันจะกำหนดเส้นขอบสำหรับแท็ก div HTML ได้อย่างไร

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

border:1px solid black;

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

สามารถใช้

border-width:2px;
border-style:solid;
border-color:black;

หรือจดชวเลข

border: 2px solid black

ตาม W3C:

เนื่องจากค่าเริ่มต้นของรูปแบบเส้นขอบคือ 'none' จะไม่สามารถมองเห็นเส้นขอบใด ๆ ได้เว้นแต่จะมีการตั้งค่าลักษณะเส้นขอบ

กล่าวอีกนัยหนึ่งคุณต้องตั้งค่าลักษณะเส้นขอบ (เช่นsolid) เพื่อให้เส้นขอบปรากฏขึ้น border:thinตั้งค่าความกว้างเท่านั้น นอกจากนี้สีตามค่าเริ่มต้นจะเหมือนกับสีข้อความ (ซึ่งโดยปกติจะดูไม่ดี)

ฉันขอแนะนำให้ตั้งค่าทั้งสามสไตล์:

style="border: thin solid black"

ฉันเดาว่านี่เป็นจุดที่คุณชี้ไปที่ ..

<div id="divActivites" name="divActivites" style="border:thin">
    <textarea id="inActivities" name="inActivities" style="border:solid">
    </textarea> 
</div> 

ดี. มันจะต้องเขียนเป็นborder-width:thin

ที่นี่คุณจะไปกับลิงค์ (คลิกที่นี่)ตรวจสอบประเภทของสไตล์ชายแดน

คุณสามารถตั้งค่าความกว้างชายแดนโดยเขียนความกว้างเป็นพิกเซล .. (เช่นความกว้างชายแดน: 1px) ความกว้างต่ำสุดคือ 1px

คุณสามารถใช้ได้:

border-style: solid;
border-width: thin;
border-color: #FFFFFF;

คุณสามารถเปลี่ยนสิ่งเหล่านี้ได้ตามที่เห็นสมควร

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

border-style: solid; border-width:thin; border-color: #FFFFFF;

ใน bootstrap 4 คุณสามารถใช้โปรแกรมอรรถประโยชน์ขอบได้

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>

<style>
  .border-5 {
    border-width: 5px !important;
  }
</style>

<textarea class="border border-dark border-5">some content</textarea>

 .centerImge {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 50%;
        height:50%;
    }
 <div>
 @foreach (var item in Model)
{
<span> <img src="@item.Thumbnail"  class="centerImge" /></span>
  <h3 style="text-align:center">  @item.CategoryName</h3>
}
 </div>

<style>
p{border: 1px solid red}
div{border: 5px solid blue}

โทรหาฉันอิชมาเอ

อย่าโทรหาฉันดึก