[分享]css做一道黑竖线

CSS是网页设计中常用的样式语言，它能够实现各种各样的效果，比如说我们今天要讲的黑竖线。下面我们来介绍一下如何用CSS实现一道简洁美观的黑竖线。/html/ /css/ line{ width: 1...

CSS是网页设计中常用的样式语言，它能够实现各种各样的效果，比如说我们今天要讲的黑竖线。下面我们来介绍一下如何用CSS实现一道简洁美观的黑竖线。

/*html*/
<div id="line"></div>

/*css*/
#line{
  width: 1px;
  background-color: black;
  height: 100px;
  margin: 0 auto;
} 

首先在HTML中创建一个"div"标签，并设置一个"ID"命名为"line"，这样我们就可以将CSS样式与此标签联系起来。接着在CSS中，我们给这个“line”设置以下的样式：

• 宽度为1像素
• 背景颜色为黑色
• 高度为100像素
• 水平居中

通过上述代码，我们就完成了一道黑竖线的制作。我们可以通过修改像素单位和颜色，来达到不同的美观效果。需要注意的是，在设置宽度时必须设置一个单位，不然会出现不显示的情况。