在使用layer数据表格的时候,默认是不可以换行的。这样显示

改动后

数据格式为   aa<br>bb就会显示为换行

比如我们的字符串是    a<br>b

这样的字符串浏览器会把它解析换行的,但是layer的数据表格的单元格高度就是那么高,不变,底层数其实是加载到了,但是由于高度不够,所以不显示

/* layui-table 表格内容允许换行 */
.layui-table-cell {
height: inherit;
}
/* layui-table 表格内容允许换行 */
.layui-table-cell {
height: auto;
}

两种都可以,这是使用高度时候 auto 和 inherit 的区别

其他人的解释:

inherit是继承父类的属性,一般用于字体、颜色、背景等
auto是按情况自适应,一般用于高度、宽度、外边距和内边距等关于长度的属性
现在一般常用的属性都支持inherit,用的不多,auto自适应长度用的比较多。如{ margin:0 auto}加上这个属性的元素只要定义了宽度就会相对于他的父元素自居中。

学习到一个知识点:

layui中如果想要合并表体的单元格,可以使用layui的模版,然后在模版中作出调整

每个单元格中多加几行,行与行之间可以使用  横线<hr/>   来作为每行之间的分割线。

同事想到的做的,自己只是积累他人的知识成为自己的。

layer数据表格换行的更多相关文章

  1. LayUI之table数据表格获取行、行高亮等相关操作

    前言 目前LayUI数据表格既美观有不乏一些实用功能.基本上表格应有的操作已经具备,LayUI作者[贤心]肯定是煞费苦心去优化,此处致敬.但是实话实话,如果单纯那数据表格功能来说,EasUI的数据表格 ...

  2. layui table数据表格reload where参数保留问题

    layui table数据表格reload where参数保留问题 在使用layui过程中多多少少会遇到些问题 table reload 有个坑:reload时where参数会保留上次的参数,如果用 ...

  3. layui 数据表格+分页+搜索+checkbox+缓存选中项数据

    在做数据表格的时候遇到了很多坑, 今天整理一下方便以后使用. 主要功能是使用数据表格, 做分页,做搜索,  还有checkbox,  支持全选. 当选中一些数据的时候, 数据切换页面数据在切换回来后, ...

  4. 全自动数据表格JQuery版

    由于最近工作上有些变动,已经快一个月没有写博客了.上一篇博客[React]全自动数据表格组件——BodeGrid介绍了全自动数据表格的设计思路以及分享了一个react.js的实现.但是现实情况中为了节 ...

  5. layui数据表格使用(一:基础篇,数据展示、分页组件、表格内嵌表单和图片)

    表格展示神器之一:layui表格 前言:在写后台管理系统中使用最多的就是表格数据展示了,使用表格组件能提高大量的开发效率,目前主流的数据表格组件有bootstrap table.layui table ...

  6. 第二百二十二节,jQuery EasyUI,DataGrid(数据表格)组件

    jQuery EasyUI,DataGrid(数据表格)组件 学习要点: 1.加载方式 2.分页功能 本节课重点了解 EasyUI 中 DataGrid(数据表格)组件的使用方法,这个组件依赖于 Pa ...

  7. layui的数据表格加上操作

    数据表格加上操作. <script type="text/html" id="barDemo"> <a class="layui-b ...

  8. Layui数据表格/搜索重加载/分条件操作/工具条监听

    <div class="layui-layout layui-layout-admin" style="padding-left: 20px;"> ...

  9. layui 数据表格按钮事件绑定和渲染

    先看效果图 使用两种渲染方法: 1.toolbar引入模板 顶部的添加和删除按钮,右侧的三个筛选,打印,导出按钮 基础参数属性:toolbar:'#demo2', //创建 删除 添加按钮模板 < ...

随机推荐

  1. leetcode1014

    这道题暴力算法,会超时: class Solution(object): def maxScoreSightseeingPair(self, A: 'List[int]') -> int: n ...

  2. shell脚本判断执行用户

    在脚本中,判断执行者是否为root. 判断方法1, #!/bin/bash if [ `whoami` != "root" ];then echo " only root ...

  3. Valgrind简单用法 (转)

    转自 http://www.cnblogs.com/sunyubo/archive/2010/05/05/2282170.html Valgrind的主要作者Julian Seward刚获得了今年的G ...

  4. visio交叉线不凸起

    使用visio作图时,经常会遇到交叉线在相交时会形成一个弯曲弓形,这有时十分影响视图效果.可以采用下面的方法消除弓形. 1.visio2003:只需要选中该交叉线,选择“格式”->“行为”,在打 ...

  5. 阅读程序 回答问题——FindTheNumber

    阅读程序 回答问题——FindTheNumber 阅读下面程序,请回答如下问题:问题1:这个程序要找的是符合什么条件的数?问题2:这样的数存在么?符合这一条件的最小的数是什么?问题3:在电脑上运行这一 ...

  6. RESTFUL 设计风格

    RESTFUL  规范总结: Rest是web服务的一种架构风格;使用HTTP,URI,XML,JSON,HTML等广泛流行的标准和协议;轻量级,跨平台,跨语言的架构设计;它是一种设计风格,不是一种标 ...

  7. 1037B--Reach Median(中位数)

    median 中位数 odd 奇数 even 奇数 You are given an array aa of nn integers and an integer ss. It is guarante ...

  8. Linux主题:获取帮助

    Linux有多种方式获取帮助,这些帮助通过不同的命令,获得不同详细程度和文字量的帮助. help help方式有两种用法,一种是help command,另一种是command --help.前一种是 ...

  9. Haskell语言学习笔记(76)Data.Tree

    Data.Tree data Tree a = Node { rootLabel :: a, subForest :: Forest a } deriving (Eq, Read, Show) typ ...

  10. python实现查找算法:二分查找法

    二分查找算法也称折半查找,基本思想就是折半,和平时猜数字游戏一样,比如猜的数字时67,猜测范围是0-100,则会先猜测中间值50,结果小了,所以就会从50-100猜测,中间值为75,结果大了,又从50 ...