发表于： 2020-06-23 21:36:28
1 1272
今天完成的事情：
花半天时间写入学自我介绍，拍照，视频
做任务13，学会侧边导航栏隐藏与显示
通过百度查找资料，发现网上大部分都是有js侧边栏，暂时不使用js,最后找到纯css侧边栏的相关练习资料：
https://blog.csdn.net/qq_34838643/article/details/71512413
了解了新属性，符号 ~ 好像可以使input与类选择器连接
input[type="checkbox"]:checked~.nav {
left: 0;
}
input[type="checkbox"]:checked~main {
margin-left: ;
}
给a设置伪类完成空心三角，空心三角使用float：right无效
html
<aside>
<ul>
<li>
<span class="sprite1"></span>
<p>公告</p>
<a href=""></a>
</li>
<li>
<span class="sprite2"></span>
<p>设置</p>
<a href=""></a>
</li>
css:
li a {
position: relative;
height: 0px;
width: 0px;
border-top: 10px solid transparent;
border-left: 10px solid #5FC0CD;
border-bottom: 10px solid transparent;
}
li a:after {
content: '';
position: absolute;
top: -9px;
left: -11px;
border-top: 9px solid transparent;
border-left: 9px solid white;
border-bottom: 9px solid transparent;
}
明天的计划：
完成任务13
返回列表
评论