提示:你可以先修改部分代码再运行。
sass
body { background-color: #d5d5d5; font-family: sans-serif; font-size: 14px; } .center { left: 50%; position: absolute; top: 50%; transform: translate(-50%, -50%); } li { margin-bottom: 14px; } input { @include screen-reader-text; &:checked { + label:before { box-shadow: inset 0 0 0 7px black; transition: box-shadow 0.2s ease-out; } &:focus + label { text-decoration: underline; &:before { outline: 0; } } } &:focus + label{ &:before { outline: 1px solid royalblue; } } } label { padding-left: 20px; position: relative; &:before { background-color: #fff; box-shadow: inset 0 0 0 0 black; content: ''; display: block; height: 13px; left: 0; overflow: hidden; position: absolute; top: 50%; transform: translate3d(0,-50%,0); transition: box-shadow 0.15s ease-in; width: 13px; } }