这个符号是从哪里来的？CSS
这个符号是从哪里来的？CSS
提问于 2018-10-17 23:45:38
我在Mozilla开发者网站上研究::before，我在codepen上使用了这个例子：
https://codepen.io/levisn1/pen/oaEPEN
var list = document.querySelector('ul');
list.addEventListener('click', function(ev) {
if (ev.target.tagName === 'LI') {
ev.target.classList.toggle('done');
}
}, false);li {
list-style-type: none;
position: relative;
margin: 2px;
padding: 0.5em 0.5em 0.5em 2em;
background: lightgrey;
font-family: sans-serif;
}
li.done {
background: #CCFF99;
}
li.done::before {
content: '';
position: absolute;
border-color: #009933;
border-style: solid;
border-width: 0 0.3em 0.25em 0;
height: 1em;
top: 1.3em;
left: 0.6em;
margin-top: -1em;
transform: rotate(45deg);
width: 0.5em;
}<ul>
<li>Buy milk</li>
<li>Take the dog for a walk</li>
<li>Exercise</li>
<li>Write code</li>
<li>Play music</li>
<li>Relax</li>
</ul>
我不明白当我点击列表中的元素时，绿色符号V是从哪里来的。它是与附加到li标记的class="done"类相关的特殊符号吗？
回答 2
Stack Overflow用户
回答已采纳
发布于 2018-10-17 23:48:45
在这里，它只是一个旋转了45度的胖边框，实际上相当聪明(去掉旋转就明白我的意思了)：
li.done::before {
content: '';
position: absolute;
border-color: #009933;
border-style: solid;
border-width: 0 0.3em 0.25em 0;
height: 1em;
top: 1.3em;
left: 0.6em;
margin-top: -1em;
transform: rotate(45deg);
width: 0.5em;
}Stack Overflow用户
发布于 2018-10-17 23:47:45
它不是一个符号，它只是一个旋转了45度的块元素
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52858816
复制相关文章
相似问题