我有一个面包屑代码,我已经设计了它,但没有显示预期的任何帮助,请将帮助。这里是我的代码和CSS样式和最终输出得到
.breadcrumb {
font-size: var(--font-small);
padding: 0 .5rem;
}
.breadcrumb ul .flexitem {
display: flex;
flex-wrap: wrap;
list-style: none;
margin: 0;
padding: 0;
}
.breadcrumb li:not(:last-child)::after {
display: inline-block;
margin: 0 .35rem;
content: '/';
}
.breadcrump li:last-child {
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: var(--light-text-color);
}
<div class="single-product">
<div class="container">
<div class="wrapper">
<div class="breadcrumb">
<ul class="flexitem">
<li><a href="#">Home</a></li>
<li><a href="#">Novels</a></li>
<li>The river and the source</li>
</ul>
</div>
</div>
</div>
</div>
1条答案
按热度按时间bwitn5fc1#
在你的代码中,你是
.breadcrumb ul .flexitem
,这应该是.breadcrumb ul.flexitem
,因为"flexitem"是ul上的一个类,而不是ul元素的子元素。