css美化radio选择框效果代码
代码语言:html
所属分类:表单美化
代码描述:css美化radio选择框效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> input[type=radio] { --s: 1em; /* control the size */ --c: #009688; /* the active color */ height: var(--s); aspect-ratio: 1; border: calc(var(--s)/8) solid #939393; padding: calc(var(--s)/8); background: radial-gradient(farthest-side,var(--c) 94%,#0000) 50%/0 0 no-repeat content-box; border-radius: 50%; outline-offset: calc(var(--s)/10); -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; font-size: inherit; transition: .3s; } input[type=radio]:checked { border-color: var(--c); background-size: 100% 100%; } input[type=radio]:dis.........完整代码请登录后点击上方下载按钮下载查看
网友评论0