如何为HTML div标签设置边框

我试图在HTML中定义一个div标签周围的边界。在某些浏览器中，边框不显示。

这是我的HTML代码:

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

我如何设置一个HTML div标签的边界?

859276 次浏览
小开
最佳答案

试着明确所有的边界属性。例如:

border:1px solid black;

看到边界简写属性。虽然其他部分是可选的，但一些浏览器不会将宽度或颜色设置为您期望的默认值。在你的例子中，我打赌它的宽度是零，除非指定。

小开

你需要设置更多的字段，而不仅仅是border-width。样式基本上是在页面上设置边框。宽度控制厚度，颜色告诉它边框的颜色。

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

我猜这就是你指的地方。

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

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

下面是链接(按此处)，查看不同类型的Border-styles

你也可以设置边界宽度通过写宽度的像素。(如border-width:1px)，最小宽度为1px。

小开

根据W3C:

由于边框样式的初始值为“none”，除非设置了边框样式，否则没有边框是可见的。

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

我建议设置这三种样式:

style="border: thin solid black"
小开

可以使用

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

或者简写

border: 2px solid black
小开

你可以使用:

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

不过，您可以根据自己的需要更改这些参数。

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

在引导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>


提交答案