CS㊑S 伪类改动input选定款式的实例编码

日期:2021-01-20 类型:科技新闻 

关键词:ps网页版在线制作,静态网页制作方法,微云网页版,怎么制作一个网页,django网页模板

注:该表引自W3School实例教程

伪原素的归类及功效:

下边根据编码看看CSS 伪类改动input选定款式的实例编码,编码以下所显示:

关键是采用了after伪类和字体样式标记。

input{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: inline-block;
}
input:after{
    content: "";
    font-size: 18px;
    display: inline-block;
    width: 14px;
    height: 14px;
    line-height: 14px;
    text-align: center;
    border: 1px solid #666fff;
    vertical-align: bottom;
}
input:checked:after{
    content: "\2714";
}

实际效果以下:

到此这篇有关CSS 伪类改动input选定款式的文章内容就详细介绍到这了,大量有关css input 选定款式內容请检索脚本制作之家之前的文章内容或再次访问下边的有关文章内容,期待大伙儿之后多多的适用脚本制作之家!