框架将原本的元素都隐藏掉了,取而代之的是根据label定义了自己的样式,如下:

[type="radio"]:not(:checked)+label {
    padding-left: 26px;
    height: 25px;
    line-height: 25px;
    font-size: 13px;
    font-weight: normal;
}

[type="radio"]:checked+label {
    padding-left: 26px;
    height: 25px;
    line-height: 25px;
    font-size: 13px;
    font-weight: normal;
}

[type="radio"].radio-col-red:checked+label:after {
    background-color: #F44336;
    border-color: #F44336;
}

从上可知,css的+号表示元素的后面兄弟元素,所以正确的打开方式是:

在表单元素后定义一个label元素就可以啦

比如:

<input type="radio" name="xx" class="radio-col-light-blue" id="xx" value="1" >
     <label for="xx">AAA</label>

没办法,用别人的框架,就得受约束,下面这个链接讲的更为详细一点

参考:https://www.cnblogs.com/hpnet/p/9350250.html

abp radio表单元素 消失了的更多相关文章

  1. angular5 表单元素 checkbox radio 组讲解

    一.checkedbox 1.ngModel绑定方式 <input [(ngModel)]="item.checked" value="item.checked&q ...

  2. HTML 5 服务器发送事件、Input 类型、表单元素、表单属性

    HTML5 服务器发送事件(server-sent event)允许网页获得来自服务器的更新. Server-Sent 事件 - 单向消息传递 Server-Sent 事件指的是网页自动获取来自服务器 ...

  3. Html5学习进阶四 表单元素和表单属性

    HTML5 的新的表单元素: HTML5 拥有若干涉及表单的元素和属性. 本章介绍以下新的表单元素: datalist keygen output 浏览器支持 Input type IE Firefo ...

  4. CSS之表单元素

    表单就是收集用户信息的,就是让用户填写的.选择的. 1                <div> 2                         <h3>欢迎注册本网站&l ...

  5. 【原】如何改变表单元素的外观(for Webkit and IE10)

    表单元素在网页设计中使用的非常频繁,如文本输入框.单选框.复选框.选择列表.上传文件,它们在浏览器中的展现有自带的外观,为了在视觉上取得更好的产品体验,保持客户端的统一,通常产品经理会提出需要改变它的 ...

  6. [转]CSS 表单元素对齐详解

    来源:http://blog.sina.com.cn/s/blog_655388ed0100lzyk.html 简单的设置input{vertical-align:middle}即可,完美的: lab ...

  7. VUE 表单元素双向绑定总结

    checkbox最基本用法: <input type="checkbox" v-model="inputdata" checked/> <in ...

  8. 9月8日HTML表单元素(form、文本、按钮、选择)

    表单元素 一.form form代表表单,功能:用于申明表单,定义采集数据的范围,也就是<form>和</form>里面包含的数据将被提交到服务器或者电子邮件里.<for ...

  9. HTML之表单元素

    A.表单元素都是放在<form></form>标签内的.来看看表单的属性  属性 值 描述 accept MIME_type 规定通过文件上传来提交的文件的类型 accept- ...

随机推荐

  1. AntDesign vue学习笔记(八)Table服务端分页使用

    本文是AntDesign后端分页方法 1.设置pagination <a-table :columns="columns" :dataSource="data&qu ...

  2. 图论 --- BFS + MST

    Borg Maze Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 7844   Accepted: 2623 Descrip ...

  3. 递推 + 高精度 --- Tiling

    Tiling Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 7264   Accepted: 3528 Descriptio ...

  4. Go语言系列教程(十二)之函数完结篇

    Hello,各位小伙伴大家好,我是小栈君.上一期我们讲到了关于函数的有参.无参.匿名函数,本期我们分享一下关于go语言函数类型.匿名函数和闭包的概念和实战.闲话不多说,立马开始分享. 在Go语言中,函 ...

  5. opencv常用数据结构

    2019/10/29 1.Mat 成员函数:cols.rows.channels.ptr获取任意行的首地址.at处理像素 2.InputArray/OutArray相当于Mat 2019/11/4 1 ...

  6. WebAPI 身份认证解决方案——Phenix.NET企业应用软件快速开发平台.使用指南.21.WebAPI服务(一)

    21   WebAPI服务 ASP.NET Web API,是微软在.NET Framework 4.5上推出的轻量级网络服务框架,虽然作为ASP.NET MVC 4的一部分,但却是一套全新的.独立的 ...

  7. 简单了解Eureka

    1.Eureka简介 Eureka是Spring Cloud Netflix微服务套件中的一部分,是一套成熟的服务注册和发现组件,可以与Springboot构建的微服务很容易的整合起来. Eureka ...

  8. 在微信小程序中使用redux

    本文主要讲述,在微信小程序中如何使用redux DEMO 需要解决的问题 如何在小程序中引入redux状态管理库,及它相关的插件? 微信小程序没有清晰的异步api,便于thunkMiddleware处 ...

  9. 编写可维护的JavaScript-随笔(六)

    避免空比较 If(item !== null){ item.sort(); Item.forEach(function(item){ //执行代码 } } } 以上判断中item期待的是数组类型的,但 ...

  10. 记录下登录Xcode 时出现 please sign in with an app-specific....

    今天做到准备提交到APP store时,要用xcode提交,在xcode->open developer tool->application loader时,要登录自己的ID,我登录时输入 ...