如下是LayUI框架中页面元素的CSS优化样式:

/* 表单输入框宽度 */
.layui-form-item .layui-input-inline {
width: 295px;
}
/* 下拉框向上弹出 */
.layui-form-select dl {
top: auto;
bottom: 36px;
}
/* 表单必填项目 */
.label-required-next:after {
top: 6px;
right: 5px;
color: red;
content: '*';
position: absolute;
margin-left: 4px;
font-weight: 700;
line-height: 1.8em;
}
/* 解决通过方法渲染的表格checkbox不居中问题 */
.layui-table-cell .layui-form-checkbox[lay-skin="primary"] {
top: 50%;
transform: translateY(-50%);
}
/* 下拉框,滚动条无法展示所有选项的问题 */
.layui-form-select dl {
max-height:250px;
}

【参考】

https://blog.csdn.net/BeauXie/article/details/60959971 layer的Icon样式以及一些常用的layer窗口使用

https://blog.csdn.net/qq_24562495/article/details/104516722 layui表单必填项带*样式

https://blog.csdn.net/cccmercy/article/details/79115550 解决Layui数据表格中checkbox位置不居中

https://blog.csdn.net/weixin_45237517/article/details/100694438 layui form 中input输入框长度的统一设置

https://blog.csdn.net/FansUnion/article/details/88616186 layui-select下拉框,滚动条无法展示所有选项的问题

https://blog.csdn.net/hangchen1025/article/details/107337215 使layui的select选择框向上弹出

LayUI样式优化的更多相关文章

  1. CSS select样式优化 含jquery代码

    CSS 下拉选择菜单基本的CSS样式不怎么好看,通过一些简单的样式优化,可以得到如下图这样的: html结构如下: <div class="sel_wrap"> < ...

  2. 上传按钮样式优化 <input type="file" />

    <html><head><title>上传按钮样式优化</title> <style>.form-element-file-wapper { ...

  3. 【前端】input radio多选事件获取所有选中的id,radio样式优化可修改

    $("#all_button").on('click', function() { obj = document.getElementsByClassName("inpu ...

  4. CSS效果:CSS select样式优化 含jquery代码

    CSS 下拉选择菜单基本的CSS样式不怎么好看,通过一些简单的样式优化,可以得到如下图这样的: html结构如下: <div class="sel_wrap"> < ...

  5. CSS select样式优化

    下拉选择菜单基本的CSS样式不怎么好看,通过一些简单的样式优化,就可以起到美化的作用了. <div class="sel_wrap"> <label>请选择 ...

  6. alert样式优化

    //alert样式优化 function alert(msg, mode) { //mode为空,即只有一个确认按钮,mode为1时有确认和取消两个按钮 msg = msg || ''; mode = ...

  7. MetaBase使用iframe内嵌到Vue页面样式优化

    Matebase是一个开源,易上手的BI工具,这里不做太多介绍了. 官网地址:https://www.metabase.com/ 解决问题描述: 使用iframe内嵌Metabase公开链接之后,页面 ...

  8. Django 小实例S1 简易学生选课管理系统 8 CSS样式优化

    Django 小实例S1 简易学生选课管理系统 第8节--CSS样式优化 点击查看教程总目录 作者自我介绍:b站小UP主,时常直播编程+红警三,python1对1辅导老师. 前面的几节下来,用户模块基 ...

  9. MVC Html.ValidationSummary()样式优化

    先看效果图 在MVC中常用ValidationSummary显示校验信息,默认样式为 针对Html.ValidationSummary()如何做优化 样式一: 在MVC中,如果你使用验证总结方法任何验 ...

  10. CSS样式优化

    一.css代码优化作用与意义 1.减少占用网页字节.在同等条件下缩短浏览器下载css代码时间,相当于加快网页打开速度2.便于维护.简化和标准化css代码让css代码减少,便于日后维护3.让自己写的cs ...

随机推荐

  1. [转帖]RocketMQ - nameSrv和Broker

    RocketMQ RocketMQ是一个统一的消息传递引擎,轻量级的数据处理平台. Name Server Name Server充当路由消息的提供者,生产者(Producer)或消费者(Custom ...

  2. [转帖]TiDB Control 使用说明

    https://docs.pingcap.com/zh/tidb/stable/tidb-control TiDB Control 是 TiDB 的命令行工具,用于获取 TiDB 状态信息,多用于调试 ...

  3. [转帖]elasticsearch8.0以上版本修改内置用户密码

    https://www.cnblogs.com/zhang-ding-1314/p/16199682.html 修改密码需要在es启动,并cd到es的bin目录下执行: 1.重置密码并在控制台显示新密 ...

  4. 防止xxs攻击,input表单中不能输入script标签

    在web网页中,所有的项目中.input表单中不能让用户输入script这些敏感性的. 一旦出现提示用户非正常输入.然后立刻将值清空 <el-input style="width:35 ...

  5. svn忽略某个目录后update出现fetching

    忽略某个子目录 在svn udpate一个大目录时忽略特定的子目录,主要是子目录下内容已经单独拉取过,并且这个大目录对于程序来说,可以是只读的. 操作方法:选中要忽略的目录,右键 svn - Unve ...

  6. 快递单中抽取关键信息【一】----基于BiGRU+CR+预训练的词向量优化

    相关文章: 1.快递单中抽取关键信息[一]----基于BiGRU+CR+预训练的词向量优化 2.快递单信息抽取[二]基于ERNIE1.0至ErnieGram + CRF预训练模型 3.快递单信息抽取[ ...

  7. 19.5 Boost Asio 传输结构体

    同步模式下的结构体传输与原生套接字实现方式完全一致,读者需要注意的是在接收参数是应该使用socket.read_some函数读取,发送参数则使用socket.write_some函数实现,对于套接字的 ...

  8. C/C++ Qt 编译打包项目

    Qt程序编译后,需要去qt目录拷贝几个文件,与qt程序放在一起该程序才可以脱离开发环境而独立运行下去,在开发环境下编译好代码以后,还需要进行以下操作将其打包才可以在别的机器上正常运行. QT的下载地址 ...

  9. 架构设计脱胎换骨!英特尔酷睿Ultra深度解析

    英特尔正式发布了第一代酷睿Ultra处理器平台,也就是首个基于Intel 4制程工艺(7nm)打造的移动级处理器平台,其核心代号为Meteor Lake,产品系列贴标设计也采用了全新方案. 同时在命名 ...

  10. 计算机网络|思维导图|自顶向下方法|MindMaps资料分享

    前言 那么这里博主先安利一下一些干货满满的专栏啦! 手撕数据结构https://blog.csdn.net/yu_cblog/category_11490888.html?spm=1001.2014. ...