HTML、CSS表格的斜表头样式设置title 画对角线
我里面有用到layui框架的影响，实际根据你自己的框架来小调下就可以
效果如下
上代码
<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>对角线单元格示例</title><style>/* 模拟对角线 */.oline {border-top: 40px #fff solid;/*上边框宽度等于表格第一行行高*/width: 0px;/*让容器宽度为0*/height: 0px;/*让容器高度为0*/border-left: 80px #fff solid;/*左边框宽度等于表格第一行第一格宽度*/position: relative;/*让里面的两个子容器绝对定位*/}.oline::before {position: absolute;top: -49px;left: -95px;width: 110px;height: 58px;background: #E3ECFF url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiPjxsaW5lIHgxPSIwIiB5MT0iMCIgeDI9IjEwMCUiIHkyPSIxMDAlIiBzdHJva2U9IiNDRUQzREMiIHN0cm9rZS13aWR0aD0iMSIvPjwvc3ZnPg==) no-repeat 100% center;content: '';}.span1 {font-style: normal;display: block;position: absolute;top: -42px;left: -43px;width: 56px;}.span2 {font-style: normal;display: block;position: absolute;top: -15px;left: -93px;width: 59px;}</style>
</head>
<body>
<table class="layui-table" style="width: auto;" border="1"> <thead> <tr><th style="width: 110px;"><div class="oline"><span class="span1">费用类别</span> <span class="span2">科室名称</span></div></th> <th style="width: 110px;">超声费</th> <th style="width: 110px;">处置</th> <th style="width: 110px;">床位费</th> <th style="width: 110px;">放射费</th> <th style="width: 110px;">护理费</th> <th style="width: 110px;">化验费</th> <th style="width: 110px;">心电图</th> <th style="width: 110px;">中医理疗费</th> <th style="width: 110px;">注射费</th> </tr></thead> <tbody> <tr> <td style="width: 110px;">**组</td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> <td style="width: 110px;">141.000</td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> </tr> <tr> <td style="width: 110px;">**组</td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> <td style="width: 110px;">25.500</td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> </tr> <tr> <td style="width: 110px;">***组</td> <td style="width: 110px;">566.000</td> <td style="width: 110px;">13.500</td> <td style="width: 110px;"></td> <td style="width: 110px;">240.000</td> <td style="width: 110px;"></td> <td style="width: 110px;">2605.900</td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> </tr> <tr> <td style="width: 110px;">**组</td> <td style="width: 110px;">410.000</td> <td style="width: 110px;">15.900</td> <td style="width: 110px;"></td> <td style="width: 110px;">180.000</td> <td style="width: 110px;"></td> <td style="width: 110px;">637.800</td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> <td style="width: 110px;"></td> </tr> </tbody></table></body>
</html>相关文章：
HTML、CSS表格的斜表头样式设置title 画对角线
我里面有用到layui框架的影响，实际根据你自己的框架来小调下就可以 效果如下 上代码 <!DOCTYPE html> <html lang"zh"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-wi…...
docker 安装mysql 5.7 详细保姆级教程
1. 安装mysql(5.7) docker pull mysql:5.7 若是拉取不了，可以配置下 docker 源 2. 查看是否安装成功 docker images 下图就是成功了 3.创建mysql专用目录、数据挂载目录、配置文件目录 ，演示目录在于/home/下 //命令逐条执行cd /home/ mkdir mysql …...
Kioptrix level3
声明！ 学习视频来自B站up主 **泷羽sec** 有兴趣的师傅可以关注一下，如涉及侵权马上删除文章，笔记只是方便各位师傅的学习和探讨，文章所提到的网站以及内容，只做学习交流，其他均与本人以及泷羽sec团队无关&a…...
UE5 Lyra项目源码分析-关卡配置加载
最近刚学完一套教程，准备研究研究官方的源码，看看自己能不能看懂。 当前分析只在本人能力之下能够分析的内容，如果有一些问题，还请大家指出。 开始 如果你打开一个别人的项目，你会从哪里看起，如果是我&am…...
Cursor重置机器码-解决Too many free trials.
参考文章：如何绕过Cursor的机器绑定限制 前言 在前面这篇文章无限使用Cursor指南中，我提到使用 无限邮箱 或者 删除账号并重新注册 的方法，来无限使用Cursor免费版。但是当在本机登录过3个账号后，就会报这个“Too many free tria…...
transformer学习笔记-自注意力机制（2）
经过上一篇transformer学习笔记-自注意力机制（1）原理学习，这一篇对其中的几个关键知识点代码演示： 1、整体qkv注意力计算 先来个最简单未经变换的QKV处理： import torch Q torch.tensor([[3.0, 3.0,0.0],[0.5, 4…...
呼叫中心呼入大模型如何对接传统呼叫中心系统？
呼叫中心呼入大模型如何对接传统呼叫中心系统？ 原作者：开源呼叫中心FreeIPCC，其Github：https://github.com/lihaiya/freeipcc 呼叫中心呼入大模型与传统呼叫中心系统的对接是一个复杂而细致的过程，涉及技术实现、流程…...
[Unity] Text文本首行缩进两个字符
Text文本首行缩进两个字符的方法比较简单。通过代码把"\u3000\u3000"加到文本字符串前面即可。 比如： 效果： 代码： TMPtext1.text "\u3000\u3000" "选择动作类型：";...
最新版Chrome浏览器加载ActiveX控件之Adobe PDF阅读器控件
背景 Adobe PDF阅读器控件是一个ActiveX控件，用于在Windows平台上显示和操作PDF文件。它提供了一系列方法和属性，可以实现对PDF文件的加载、显示、搜索、打印、保存等操作。 allWebPlugin中间件是一款为用户提供安全、可靠、便捷的浏览器插件服务的中间件…...
springboot 对接 ollama
spring ai 对接 ollama 引入依赖 <dependency><groupId>io.springboot.ai</groupId><artifactId>spring-ai-ollama-spring-boot-starter</artifactId><version>1.0.0</version> </dependency>这里因为使用的是快照版本所以需…...
【数据库】选择题+填空+简答
1.关于冗余数据的叙述中，不正确的是（） A.冗余的存在容易破坏数据库的完整新 B.冗余的存在给数据库的维护增加困难 C.不应该在数据库中存储任何冗余数据 D.冗余数据是指由基本数据导出的数据 C 2.最终用户使用的数据视图称为（&…...
从0开始写android 之xwindow
模拟实现android的窗口系统本质上还是在ubuntu 上实现自己的窗口系统， xwindow是一套成熟的解决方案。在ubuntu上使用xwindow的好处之一 是ubuntu自带xwindow的库， 直接引用头文件和库文件。下面来了解下 xwindow的基本函数接口。 参考 https://tronche…...
The Past, Present and Future of Apache Flink
摘要：本文整理自阿里云开源大数据负责人王峰（莫问）在 Flink Forward Asia 2024上海站主论坛开场的分享，今年正值Flink开源项目诞生的第10周年，借此时机，王峰回顾了Flink在过去10年的发展历程以及 Flink社区…...
多模块应用、发布使用第三方库（持续更新中）
目录: 1、多模块概述（HAP、HSP、HAR） HAR与HSP两种共享包的主要区别体现在： 2、三类模块： 3、创建项目：项目名：meituan （1）创建Ability类型的Module，编译后为HAP文件…...
An error happened while trying to locate the file on the Hub and we cannot f
An error happened while trying to locate the file on the Hub and we cannot find the requested files in the local cache. Please check your connection and try again or make sure your Internet connection is on. 关于上述comfy ui使用control net预处理器的报错问…...
UE5安装Fab插件
今天才知道原来Fab也有类似Quixel Bridge的插件，于是立马就安装上了，这里分享一下安装方法 在Epic客户端 - 库 - Fab Library 搜索 Fab 即可安装Fab插件 然后重启引擎，在插件面板勾选即可 然后在窗口这就有了 引擎左下角也会多出一个Fab图标…...
Linux C语言操作sqlite3数据库
一、环境配置 1、下载源码：sqlite-autoconf-3470200.tar.gz 2、解压，cd到源码主目录 3、配置参数 ./configure --prefix/usr/local/ 如果是交叉编译环境 ./configure CC/opt/rk3288/gcc-linaro/bin/arm-linux-gnueabihf-gcc --hostarm-linux --pre…...
【人工智能】因果推断与数据分析：用Python探索数据间的因果关系
解锁Python编程的无限可能：《奇妙的Python》带你漫游代码世界 因果推断是数据科学领域的一个重要方向，旨在发现变量间的因果关系，而不仅仅是相关性。本篇文章将从因果推断的理论基础出发，介绍因果关系的定义与建模方法，涵盖因果图（Causal Graph）、d-分离、反事实估计等…...
freeswitch（30秒自动挂断）
亲测版本centos 7.9系统–》 freeswitch1.10.9 本人freeswitch安装路径（根据自己的路径进入） /usr/local/freeswitch/etc/freeswitch场景说明： A和B接通通话时候，时间开始计算到达30秒后自动挂断使用方法 进入/usr/local/freeswitch/etc...
)
大模型呼入机器人有哪些功能特点？(转)
大模型呼入机器人有哪些功能特点？(转) 原作者：开源呼叫中心FreeIPCC，其Github：https://github.com/lihaiya/freeipcc 大模型呼入机器人，作为现代通信技术与人工智能深度融合的产物，正逐渐成为企业提升服务…...
linux的常识及术语解释
1. 在Linux系统中，以 文件 方式访问设备 。 2. Linux内核引导时，从文件 /etc/fstab 中读取要加载的文件系统。 3. Linux文件系统中每个文件用 i节点 来标识。 4. 全部磁盘块由四个部分组成，分别为引导块 、专用块 、 i节点表块 和数据存储块。…...
无监督聚类中的特征选择：原理、陷阱与工业级实践
1. 项目概述：为什么无监督聚类中的特征选择，比你想象中更难也更重要“Feature selection for unsupervised problems: the case of clustering”——这个标题乍看像一篇论文的副标题，但如果你真在工业场景里做过客户分群、设备异常模式挖掘、…...
如何快速完成AI智能图像分层：layerdivider完整使用指南
如何快速完成AI智能图像分层：layerdivider完整使用指南 【免费下载链接】layerdivider A tool to divide a single illustration into a layered structure. 项目地址: https://gitcode.com/gh_mirrors/la/layerdivider 你是否曾经面对复杂的插画设计&#x…...
如何快速为小爱音箱添加AI大脑：终极智能升级指南
如何快速为小爱音箱添加AI大脑：终极智能升级指南 【免费下载链接】mi-gpt 🏠 将小爱音箱接入 ChatGPT 和豆包，改造成你的专属语音助手。 项目地址: https://gitcode.com/GitHub_Trending/mi/mi-gpt 想让家中的小爱音箱从"人工智障…...
抖音批量下载神器：免费开源工具终极指南，轻松保存高清视频与音乐
抖音批量下载神器：免费开源工具终极指南，轻松保存高清视频与音乐 【免费下载链接】douyin-downloader A practical Douyin downloader for both single-item and profile batch downloads, with progress display, retries, SQLite deduplication, and b…...
Adobe-GenP 3.0：解锁Adobe全家桶专业功能的简易指南
Adobe-GenP 3.0：解锁Adobe全家桶专业功能的简易指南 【免费下载链接】Adobe-GenP Adobe CC 2019/2020/2021/2022/2023 GenP Universal Patch 3.0 项目地址: https://gitcode.com/gh_mirrors/ad/Adobe-GenP 还在为Adobe Creative Cloud的高昂订阅费用而烦恼吗…...
如何在5分钟内掌握Windows上最强大的屏幕标注工具ppInk
如何在5分钟内掌握Windows上最强大的屏幕标注工具ppInk 【免费下载链接】ppInk Fork from Gink 项目地址: https://gitcode.com/gh_mirrors/pp/ppInk 你是否曾在演示、教学或远程协作中，需要在屏幕上快速标注重点，却发现工具要么太复杂࿰…...
什么是vibe coding：概念解析与首选工具Trae实测
什么是vibe coding：概念解析与首选工具Trae实测你是否好奇vibe coding到底是什么，为何能成为2025年最火的开发方式？是否想知道vibe coding和传统编程的核心差异，以及用什么工具能高效落地？vibe coding是提示词驱动开发…...
[开源] 交班信息一致性校验系统：面向临床医护的实时语义冲突检测与结构化摘要生成
本项目是专为国内医院交班场景设计的电子病历（EMR）辅助工具，解决护士与医生在护理记录和病程记录中同步填写、异步理解、隐性冲突这一长期存在的质控盲区。我们不替代人工判断，而是把“同一时间窗内两条记录是否说同一件事”这件事…...
AI时代软件工程教育：同理心融入技术课程的教学实践
1. 项目概述：当代码遇见人心最近几年，我一直在高校和培训机构里讲授软件工程相关的课程，从传统的软件生命周期、设计模式，到如今火热的敏捷开发、DevOps。一个越来越强烈的感受是：我们的技术教育，似乎正在与…...