如何为HTML div标签设置边框

时间:2010-01-07 13:16:10

标签: html css border

我正在尝试在HTML中定义div标签周围的边框。在某些浏览器中,边框不会出现。

这是我的HTML代码:

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

如何为HTML div标签设置边框?

8 个答案:

答案 0 :(得分:305)

尝试明确所有边框属性。例如:

border:1px solid black;

Border shorthand property。虽然其他位是可选的,但某些浏览器不会将宽度或颜色设置为您期望的默认值。在你的情况下,我敢打赌,除非另有说明,否则宽度为零。

答案 1 :(得分:26)

可以使用

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

或简写

border: 2px solid black

答案 2 :(得分:16)

根据W3C:

  

由于边框样式的初始值为“none”,因此除非设置了边框样式,否则不会显示任何边框。

换句话说,您需要为要显示的边框设置边框样式(例如solid)。 border:thin仅设置宽度。此外,默认情况下颜色与文本颜色相同(通常看起来不太好)。

我建议设置所有三种样式:

style="border: thin solid black"

答案 3 :(得分:4)

我想这就是你指向的地方..

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

好。它必须写成border-width:thin

在这里,您可以使用link (click here)查看不同类型的边框样式

您也可以通过以像素为单位写宽度来设置边框宽度..(如border-width:1px),最小宽度为1px。

答案 4 :(得分:4)

您可以使用:

if curseword in typed or curseword2 in typed or curseword3 typed:
    print "No cursing! It's not nice!"

您可以根据需要更改这些内容。

答案 5 :(得分:2)

您需要设置更多字段,然后才能设置边框宽度。样式基本上将边框放在页面上。宽度控制厚度,颜色告诉它边框的颜色。

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

答案 6 :(得分:1)

在引导程序4中,您可以像这样使用 border utilities

<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>

答案 7 :(得分:0)

 .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>