<template>
<div>
<div class="heng-div">
<el-radio v-model="radio" label="0" class="chun-se">纯色 </el-radio> <el-color-picker v-model="color4" class="min-div" size="mini"></el-color-picker>
<el-radio v-model="radio" label="1">图片<i class="el-icon-info ele-icon"></i></el-radio>
<el-radio v-model="radio" label="2">视频<i class="el-icon-warning ele-icon"></i></el-radio>
<el-radio v-model="radio" label="3">直播<i class="el-icon-warning ele-icon"></i></el-radio>
</div>
</div>
</template> <script>
export default {
data(){
return{
radio: '1',
color4:"#409EFF"
}
}
}
</script> <style scoped> .ele-icon{
color: #ccc;
} .heng-div{
display: flex;
align-items: center;
}
.chun-se{
margin-right: 0 !important;
}
.min-div{
margin-right: 30px;
} </style>

elementUI自定义单选框内容的更多相关文章

  1. CSS学习笔记三:自定义单选框,复选框,开关

    一点一点学习CCS,这次学习了如何自定义单选框,复选框以及开关. 一.单选框 1.先写好body里面的样式,先写几个框 <body> <div class="radio-1 ...

  2. 自定义单选框radio样式

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  3. vue+elementUI中单选框el-radio设置默认值和唯一标识某个单选框

    vue+elementUI中单选框el-radio设置默认值 如果后台返回的单选框的值是number:单选框的lable需要设置成 :lable='0';如下: <el-form-item la ...

  4. PHP下拉框内容随单选框内容变化

    这久在修改一个项目的小东西,要求把下拉框改为单选框,由于代码封闭,修改不了获取函数,所以想了个办法让下拉框的内容随单选框的内容变化,下面把代码分享给大家: <!DOCTYPE html PUBL ...

  5. element-ui 带单选框的表格

    效果:不只是带单选框,点击当前行单选框选中状态网上查了一些发现很多都是只能点击当前radio选中当前行,配合element-ui的单选table时发现两个的选择状态是不一致的,所以调整了一下效果 提供 ...

  6. jq form表单渲染单选框内容渲染

    单选框赋值 单选按钮赋值的主要就在于一个value值和name值对应,但是单选的选中状态按钮是input标签的check(选中)属性 当newattr的属性是1的时候为true,或者当newattr的 ...

  7. 在echarts中自定义提示框内容

    1.期望效果 以柱状图为例,在鼠标滑过每个数据标签时,为了更友好地显示数据内容,需要对显示的数据内容作格式化处理,添加自定义内容. 如下图,鼠标滑过每个数据项时, 第1张是默认提示框: 第2张是处理成 ...

  8. Echarts修改提示框及自定义提示框内容

    1:首先先定义自定义的json数据 var msg = [{ 'tell':'110', 'ContentMessage':"我今天去吃大餐" },{ 'tell':'111', ...

  9. 商务系统的构造思路(无源码!)+如何用jsp实现点击单选框内容显示在另一个jsp页面

    敲码经验总结: 之前犯了一个错误就是,没有从底层开始学起,有啥问题,就直接博客园找源码,去CSDN找源代码,看到代码就复制粘贴,结果从新梳理知识点的时候,貌似除了复制粘贴,印象深刻的知识啥也没学到. ...

  10. js初学—js全自定义单选框

    代码如下: <script type="text/javascript"> window.onload=function() { var oIput=document. ...

随机推荐

  1. A/B 实验避坑指南:为什么不建议开 AABB 实验

    更多技术交流.求职机会,欢迎关注字节跳动数据平台微信公众号,回复[1]进入官方交流群 本文将针对日常开设 A/B 实验过程中一个不太合理的使用方法--AABB 实验进行详细的解释,告诉大家为什么不建议 ...

  2. PPT 光效果

    点状.线状.面状.光影 "光" = PPT高大上的秘密

  3. PPT 动态迷幻图谱

    迷幻动画的本质拆解 插件: islide + 软件: PowerPoint https://www.islide.cc/ 圆型 画一个正圆,无填充色,边框 2.25磅 左边红色.右边黄色.中间两个透明 ...

  4. NettyHandler 常用生命周期方法

    NettyHandler 常用生命周期方法 @Component @ChannelHandler.Sharable //表示这里是线程安全的 public class ImServerHandler ...

  5. Django rest_framework使用自定义异常

    完整代码 https://gitee.com/mom925/django-system 在settings.py中配置 REST_FRAMEWORK = { "EXCEPTION_HANDL ...

  6. print('Hello World!')的新玩法

    相信很多同学入门Python的第一行代码都是print('Hello World!') print是初学者最先接触的Python函数,但是很多人可能到现在也不完全清楚它的用法. print(*obje ...

  7. mysql--read only

    问题背景: 1.在进行数据迁移和从库只读状态设置时,都会涉及到只读状态和Master-Slave主从关系设置 2.数据库参数文件默认是只读,重启数据库服务时 解决方法: 1.在my.cnf配置文件中添 ...

  8. AtCoder Beginner Contest 185 题解

    A - ABC Preparation 排序找出最小值 int main() { ios_base::sync_with_stdio(false), cin.tie(0); vector<int ...

  9. Windows 端使用 C++ 服务操作类

    #pragma once #include <windows.h> #include <string> // #include <iostream> class S ...

  10. #1495:非常可乐(BFS+数论)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1495 BFS解法 题目 给三个数字 s n m s=n+m s在1到100之间 就是个倒水问题可以从第 ...