首页 > 其他分享 >Vue中单选框或复选框中的label内容过长,超出范围

Vue中单选框或复选框中的label内容过长,超出范围

时间:2023-04-17 10:46:58浏览次数:43  
标签:__ Vue 字体大小 单选框 复选框 超出范围 label

 

解决办法:

1、直接把字体调小

2、当需要的字体大小还是超出了范围时

  在css中写(如果是复选框;单选框的class: el-radio__label)

        .el-checkbox__label {
            text-overflow: ellipsis;
            white-space: normal;
            line-height: 18px;
            vertical-align: middle;
            display: inline-block;
        }

当添加了css后,还可以选择字体大小,此时不会出现超出范围的情况

 

标签:__,Vue,字体大小,单选框,复选框,超出范围,label
From: https://www.cnblogs.com/huang2979127746/p/17325011.html

相关文章

  • vite启动vue项目报错import { performance } from 'node:perf_hooks'
    import{performance}from'node:perf_hooks'^^^^^^SyntaxError:Cannotuseimportstatementoutsideamodule要求node版本要大于16 使用nvm切换node版本 成功运行......
  • vue中el-checkbox全选、反选、多选
    <template><div><el-checkboxv-model="checkAll"@change="handleCheckAllChange":indeterminate="isIndeterminate">全选</el-checkbox><el-checkboxv-model="c......
  • vue input每次输入一个字符后自动失去焦点 问题
    我在输入框输入的时候,每输入一次,输入框就自动失去焦点了。ps:实现的功能是,一个列表组件,每个对象中都有一个input输入框。<divclass="addTags"v-for="(item,index)inlist":key="item.title"><inputtype="text"v-model="item.title"></div>原因问......
  • 在Vue中,关于require与required
    在Vue里面,是用require还是required?始终拿捏不定,所以这里记录一下图片是require('@/xxx')props里面是required表单验证里面是required总结:只有图片是require,其它都是required......
  • vue 项目npm run dev(启动)时报错The service was stopped
    vue项目yarnupgrade后vitebuild报错,如何项目也运行不起来了。报错截图:解决办法:删除node_modules文件夹,然后执行yarninstall重新生成心的node_modules。......
  • 复选框数据通过axios和Vue传输到servlet后台
    引言本来是想百度一下如何将table标签里面嵌入的复选框通过axios以及Vue传输到Servlet后台;百度之后才发现,是我草率了,原来可以直接用复选框标签进行传输(好吧,又暴露了自己基础不扎实的事实......)相关实现步骤1、将相关的标签el-checkbox引入进去这里我们需要引入三个带有el的标......
  • vue2源码-六、根据render函数生成vnode
    根据render函数生成vnode上文介绍上面已经将模板编译成了render函数,下面就要使用render函数,从而完成渲染的操作:首先,根据render函数生成虚拟节点;然后根据虚拟节点+真实数据生成真实节点。实现mountComponent方法,完成渲染虚拟节点生成封装vm._render方法。Vue.proto......
  • vue按钮禁用
    一个按钮的动态禁用设置是如此多坑必须要用到prop、dataprop来绑定其属性disabled,data是因为prop属性的内容不可改变。<template><div><el-buttontype="success"size="small"@click="check">龟龟</el-button><el-buttontype="success&q......
  • 前端学习笔记——Vue3组件间数值传递
    依据个人的学习需求,对Vue官网中组件部分内容的搬运和总结,可用于参看,想详细了解Vue3这部分特性的可以直接参考官网内容:https://cn.vuejs.orgprops是一种特别的attributes,我们可以在组件上生命注册。比如:如果我们要传递给博客文章组建一个标题的话,我们则必须在该组件的props列表......
  • vue-devtool
    vue-devtool是使用vue必不可少的一个工具,他可以让你在开发vue项目的时候,实时展示页面上的变量。1、下载到github下载:https://github.com/vuejs/devtools可使用git或者直接下载zip包安装依赖,最好使用yarn,因为该项目使用yarn这一步会比较久,需要耐心等待,预计等待10分钟到1个......