我想更改详细信息中出现的箭头的位置。我尝试过 float:left 但如果线条太大(如上面示例中的线条),则当我调整窗口大小时,箭头将移动到下方线条的开头。我希望它保留在第一行的第一个字母之外。
我怎样才能做到这一点?
Example:
<details>
<summary>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut
gravida iaculis arcu, et hendrerit arcu. Morbi rhoncus ex quam, quis.
</summary>
Content goes here.
</details>
<style>
summary::-webkit-details-marker {
display: none
}
summary:after {
content: "+";
color: #fff;
float: left;
}
details[open] summary:after {
content: "-";
}
</style>
use :before
代替:after
summary::-webkit-details-marker {
display: none
}
summary:before {
content: "+";
color: red;
float: left;
margin-right: 10px;
}
details[open] summary:before {
content: "-";
}
<details>
<summary>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut
gravida iaculis arcu, et hendrerit arcu. Morbi rhoncus ex quam, quis.
</summary>
Content goes here.
</details>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)