<ul uk-accordion="multiple: true">
<li>
<a class="uk-accordion-title" href="#">項目１</a>
<div class="uk-accordion-content">項目１の中身です。</div>
</li>
<li>
<a class="uk-accordion-title" href="#">項目２</a>
<div class="uk-accordion-content">項目２の中身です。</div>
</li>
<li>
<a class="uk-accordion-title" href="#">項目３</a>
<div class="uk-accordion-content">項目３の中身です。</div>
</li>
</ul>
ul {
li {
.uk-accordion-title {
position: relative;
&::before {
background-image: none;
content: "";
background-color: red;
width: 14px;
height: 2px;
position: absolute;
top: 50%;
transform:translateY(-50%);
right: 40px;
}
&::after {
content: "";
background-color: red;
width: 2px;
height: 14px;
position: absolute;
top: 50%;
transform:translate(50%,-50%);
right: 47px;
}
}
}
}
.uk-open {
>.uk-accordion-title {
&::before {
background-image: none;
}
&::after {
content: none;
}
}
}
View Compiled
