如何将开关旁边的文本垂直居中?
P粉354948724
P粉354948724 2023-09-15 11:58:54
0
1
396

我想在“toggle-label”类中心与“switch”垂直制作一个文本,但我失败了 这是我使用的代码

.toggle-label { font-weight: bold; font-size: 20px; } .switch { position: relative; display: inline-block; width: 54px; height: 28px; } .switch input { opacity: 0; width: 0; height: 0; } .slider-round { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; border-radius: 34px; } .slider-round:before { position: absolute; content: ""; height: 20px; width: 20px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s; border-radius: 50%; } .switch input:checked+.slider-round { background-color: #e53f71; } .switch input:focus+.slider-round { box-shadow: 0 0 1px #e53f71; } .switch input:checked+.slider-round:before { -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px); }
BGM  SFX 

我尝试设置切换标签的顶部填充,但它仍然不起作用 请帮助我使切换标签与开关垂直居中

P粉354948724
P粉354948724

全部回复 (1)
P粉489081732

尝试添加

垂直对齐:中间;

.toggle-label.switch

这应该会让他们彼此相处融洽。

    最新下载
    更多>
    网站特效
    网站源码
    网站素材
    前端模板
    关于我们 免责声明 Sitemap
    PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!