胶水元素

before, after

2025-04-12

Written by: tdtc

zh-CN: 胶水元素可以使用在元素上，也可以使用在类（以及状态类）

en-US: Glue(or Adhesive) elements can be used on elements or on classes (including state classes).

无障碍考虑:
不鼓励使用胶水元素添加内容，因为屏幕阅读器无法可靠地访问它。
Examples are from Bootstrap v4.6.2

before

breadcrumb

.breadcrumb-item + .breadcrumb-item::before {
  float: left;
  padding-right: 0.5rem;
  color: #6c757d;
  content: "/";
}

after

.dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0.3em solid;
  border-right: 0.3em solid transparent;
  border-bottom: 0;
  border-left: 0.3em solid transparent;
}

Ref