css 伪类或伪元素

t3irkdon 于 2023-05-02 发布在其他

关注(0)|答案(1)|浏览(106)

我有一个div元素，类为.parent-div。它有一个border-bottom，厚1px，宽608px。div本身的宽度为600px。我需要使border-bottom的最后20%的高度与其余部分不同。我尝试使用::before和::after伪元素，但它们似乎不起作用。有人能帮我达到这个效果吗？下面是.parent-div的CSS：

.parent-div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 608px;
  position: relative;
  margin-top: 100px;
  left: 50%;
  transform: translateX(-50%);
  border-bottom: 1px solid #bdbdbd;
  padding-bottom: 18px;
}

<div class="parent-div"></div>

css

来源：https://stackoverflow.com/questions/76136801/pseudo-class-or-pseudo-element

1条答案

按热度按时间

z0qdvdin1#

下面是问题下面的评论中发布的解决方案。

<div class="centered-div">#todo</div> 
<div class="parent-div"> 
  <div class="child-div" id="all">All</div> 
  <div class="child-div">Active</div> 
  <div class="child-div">Completed</div> 
</div> 

<form id="form"> 
  <input type="text" name="detail" placeholder="add details"> 
  <button>Add</button> 
</form> 

<div id="results"></div>

我还删除了<input>标记上的结束斜杠，因为没有HTML规范要求这样做。

赞(0）回复(0）举报 2023-05-02

我来回答

css 伪类或伪元素

1条答案

相关问题

热门标签

最新问答