-
2021-06-17 08:39:46
我们在Excel中可以使用文字上标、下标来制作单线斜线表头,到了Word当中,我们也经常需要这样的操作,那单纯的Word中,我们又该如何操作呢?
来分享分享单线表头的制作方法。
一、课前思考
实现以下的效果,你都有什么方法呢?今天我们来盘点一下。开始之前,可以自己思考思考,如果是你,你怎么实现?
二、实现步骤
1、第一种:Excel复制法。
我们在Excel中制作好单线表头,然后再复制过来。
我们输入文字,第一个文字,选择字体中的下标,第二个文字选择字体中的上标。调整字体大小,添加斜线。
我们演示直接在Word中调整,跟Excel调整略有差异,本质一样。
2、第二种:调整缩进来制作单线斜线表头
同样输入文字(这次输入的是两行),我们直接在【表设计】选项卡中,选择斜线。然后我们将光标放在第一个上,通过移动标尺上的首行缩进来调整。再放到第二个上,通过移动表示上的右缩进来调整。
三、课后提升
1、单斜线的方法还有一个就是直接插入文本框的方式来操作,我们就不再详细讲解了比较简单;
----------------------
好了,学会了吗?如果你还遇到解决不了的问题,都可留言告诉我们。我们将在第一时间帮助您解决。
征集:征集20例Word实际操作案例,比如说:这个简历怎么做出来的?Word怎么做出美观的日历?日常看到的,工作需要的,都可以发过来,一起复盘,一起进步。
更多相关内容 -
5种做法实现table表格中的斜线表头效果
2020-12-14 03:52:08table表格,这个东西大家肯定都不陌生,代码中我们时常都能碰到,那么给table加一个斜线的表头有时是很有必要的,但是到底该怎么实现这种效果呢? 我总结了以下几种方法: 1、最最最简单的做法 直接去找公司的UI,让... -
element 表头添加斜线
2020-06-04 17:18:53实现原理 ... 通过旋转两个单元格伪元素,并设置旋转起始点,使两个伪元素旋转到重合位置,达到斜线的效果 <el-table :data="tableData" border size="mini" stripe :header-cell-style="h...实现原理
通过改css样式实现
- 去掉第一个单元格的下边框
- 第一列第一个单元格和第二个单元格的伪元素设置绝对定位,宽度设成1px,高度根据自己表格调整
- 通过旋转两个单元格伪元素,并设置旋转起始点,使两个伪元素旋转到重合位置,达到斜线的效果
- 注意style不要设置scope
<el-table :data="tableData" border size="mini" stripe :header-cell-style="headClass" style="width: 100%;border:1px solid #00aeef;" > <el-table-column prop="year" label="行业" align="center" width="70" style="background:#ffffff !important;" > <el-table-column prop="year" label="时间" align="center" width="70" style="background:#ffffff;" > <template slot-scope="scope"> {{ scope.row.year }}年 </template> </el-table-column> </el-table-column> <el-table-column prop="keyun_number" label="客运" align="center" width="65" > </el-table-column> </table>
//css // 不要设置 scope <style lang="less"> .el-table thead.is-group th { background: none; padding: 0px; } .el-table thead.is-group tr:first-of-type th:first-of-type, .el-table thead.is-group tr:last-of-type th:first-of-type { background: #ffffff !important; } .el-table thead.is-group tr:first-of-type th:first-of-type { border-bottom: none; } .el-table thead.is-group tr:first-of-type th:first-of-type div.cell { text-align: right; } .el-table thead.is-group tr:last-of-type th:first-of-type div.cell { text-align: left; } .el-table thead.is-group tr:first-of-type th:first-of-type:before { content: ""; position: absolute; width: 1px; // height: 55px; height: 42px; //自行调整 top: 0; left: 0; background-color: grey; opacity: 0.2; display: block; // transform: rotate(-43deg); transform: rotate(-56deg); //自行调整 -webkit-transform-origin: top; transform-origin: top; } .el-table thead.is-group tr:last-of-type th:first-of-type:before { content: ""; position: absolute; width: 1px; // height: 60px; height: 46px; //自行调整 bottom: 0; right: 0; background-color: grey; opacity: 0.2; display: block; // transform: rotate(-45deg); //自行调整 transform: rotate(-56deg); -webkit-transform-origin: bottom; transform-origin: bottom; } </style>
-
Excel表头斜线设置秘技.docx
2021-09-26 23:00:45Excel表头斜线设置秘技.docx -
ccs制作表头有斜线的表格
2018-09-04 17:22:20使用css制作表头带有斜线分隔的表格,并基于Bootstrap 自适应 -
Word 如何添加斜线表头(单/多斜线)
2020-02-11 12:08:31简单的单条斜线 (图中的成绩改为姓名) 实现过程 中等难度的多条斜线 实现流程 这里建议可以将需要操作的小框里面的文字先删除(如果不多的话) 将线条颜色更改,再将文字填充,最后调调格式。 后记...引言
熟练使用 Word,Excel 非常重要,写程序再厉害,也不可能每一份小数据都用程序处理吧,Excel 就派上了用场,将数据分析结果以图文形式呈现给他人,又或者是平时论文的撰写,无比需要使用 word,当然,你也可以直接 LaTeX 或者 Markdown。不过一句话,现在练起来吧,别等到写 毕业论文/上交业务 时才后悔没跟宿舍或公司的 Office 大神搞好关系。
Word 的技巧看似琐碎,单积累到一定程度后,便可以发现许多技巧都存在共通之处,小事情重复做也会成为大麻烦,但高手都懂得分类处理。
Office 的使用跟写程序中用到的循环一样,贯通了 3 个核心,我们才能省时省事,成为别人眼中的高手。
- 大量重复的工作懂得批处理
- 反复要做的固定操作固化成 " 模板 “,” 套路 "
- 碰到异常情况,知道准确高效的解决。
业务需求 & 效果实现
简单的单条斜线 (图中的成绩改为姓名)
实现过程
中等难度的多条斜线
实现流程
这里建议可以将需要操作的小框里面的文字先删除(如果不多的话)
将线条颜色更改,再将文字填充,最后调调格式。后记
此操作有点简陋,后面再来,加油!
-
table表头斜线
2017-10-17 14:43:27一、代码<div id="article_content" class="article_content tracking-ad" data-mod="popu_307" data-dsm="post"><!DOCTYPE html> <html> <head> <...一、代码
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>用div+css模拟表格对角线</title> <style type="text/css"> *{padding:0;margin:0;} caption{font-size:14px;font-weight:bold;} table{ border-collapse:collapse;border:1px #525152 solid;width:50%;margin:0 auto;margin-top:100px;} th,td{border:1px #525152 solid;text-align:center;font-size:12px;line-height:30px;} /*模拟对角线*/ .out{ border-top:40px #D6D3D6 solid;/*上边框宽度等于表格第一行行高*/ width:0px;/*让容器宽度为0*/ height:0px;/*让容器高度为0*/ border-left:80px #BDBABD solid;/*左边框宽度等于表格第一行第一格宽度*/ position:relative;/*让里面的两个子容器绝对定位*/ } b{font-style:normal;display:block;position:absolute;top:-40px;left:-40px;width:35px;} em{font-style:normal;display:block;position:absolute;top:-25px;left:-70px;width:55x;} </style> </head> <body> <table> <caption>用div+css模拟表格对角线</caption> <tr> <th style="width:80px;"> <div class="out"> <b>类别</b> <em>姓名</em> </div> </th> <th>年级</th> <th>班级</th> <th>成绩</th> <th>班级均分</th> </tr> <tr> <td class="t1">张三</td> <td>三</td> <td>2</td> <td>62</td> <td>61</td> </tr> <tr> <td class="t1">李四</td> <td>三</td> <td>1</td> <td>48</td> <td>67</td> </tr> <tr> <td class="t1">王五</td> <td>三</td> <td>5</td> <td>79</td> <td>63</td> </tr> <tr> <td class="t1">赵六</td> <td>三</td> <td>4</td> <td>89</td> <td>66</td> </tr> </table> </body> </html>
二、样式图
-
div+css编写html的table表头斜线
2021-06-11 13:29:15用div+css模拟表格对角线 *{padding:0;margin:0;} caption{font-size:14px;font-weight:bold;} table{ border-collapse:collapse;border:1px #525152 solid;width:50%;margin:0 auto;margin-top:100px;... -
在EXCEL中如何设置双斜线表头.docx
2021-09-27 06:23:53在EXCEL中如何设置双斜线表头.docx -
table 表头斜线样式
2021-05-08 10:52:221.css html: <table class="tableStyle"> <thead> <tr> <th> <div class="out"> <b>信息</b> <em>姓名</em> </div -
Table表格加斜线表头
2021-06-10 15:47:57充值积分 充值会员 更多说明» 代码描述:table加斜线表头 1、td内容设置 项目 年份 2、斜线 #lineTd { background: #fff url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9... -
element表格表头显示斜杠
2021-11-15 18:45:16最近开发碰到项目原型图的表格的表头有一个斜杠展示效果,通过修改element原有的样式也是成功将这个效果做了出来,话不多说,直接上代码。 html <div> <el-table :data="tableData" border stripe> &... -
用js作表格的表头斜线
2009-06-23 14:23:40用js作表格的表头斜线 用js作表格的表头斜线 -
table表格做一个表头斜线样式
2018-08-24 23:56:09具体代码实现如下: &lt;!doctype html&gt; &lt;html lang="en"&gt; &lt;head&gt; &...带表头斜线的表格&lt -
VBA动态设置Excel斜线表头的方法.docx
2021-09-27 01:57:48VBA动态设置Excel斜线表头的方法.docx -
【css】css实现斜线表头
2022-03-29 14:05:37文章目录前言一、成果展示二、实现 前言 例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习,本文就介绍了机器学习的基础内容。 一、成果展示 二、实现 ... -
润乾报表 表头斜线 怎么设置
2021-11-11 16:58:47先上效果图: 实现方法: 选中单元格-边框设置-选择斜线边框 如想实现上图效果,将单元格的文本内容设置为 时间,项目 。注意逗号分隔 -
纯css绘制斜线表头
2021-01-19 09:52:28效果图如下 代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> ... -
利用servlet生成报表表头斜线
2019-03-17 01:12:13NULL 博文链接:https://gaojiewyh.iteye.com/blog/465853 -
table表头斜线自适应
2020-02-24 14:22:05需求:要求做一张表格,表头第一栏有斜线分割,且分割线也要跟随表格自适应 思路:因为之前用了CSS去写,但是发现,只能实现固定的长和宽,如果页面伸缩,斜线就会破版,跟th或者td衔接不上。因此转而将目标锁定在... -
vue3+el-table表格表头增加斜线
2022-01-25 11:27:33类似excel可以加斜线有双表头,如下图(咱们当时一整个难住,咱们裙裙难受) 2.咱们开始面向百度,找到一个好主意! 上链接 3.可能会有多级表头所有把table封装了一下,所以我没有用插槽来处理斜线,直接用到了多级... -
Excel表格中如何设置\插入斜线表头?
2019-11-05 21:49:34第一步:选中需要设置斜线表头的单元格 第二步:右键打开设置单元格格式,选择边框-添加斜线(如下图所示) 第三步:插入文本框,调整文本框文字大小、位置,设置文本框无填充、无线条 整体效果如下: 按照以上... -
html table 表头 分割斜线
2021-06-10 15:48:561function a(x, y, color) {document.write("")}style='background: transparent; font-size:13pt'>sectorstyle='background: transparent; font-size:11pt'>regionfunction line(x1, y1, x2, y2, color) {var... -
前端基础学习-element-ui表格表头做成斜线表头
2021-01-06 15:45:38这部分代码样式部分参照表头斜线 首先上效果图 这里主要是针对二级表头对其样式进行选择修改,这里需要注意一定要是二级表头才能做出这样的效果 html代码 <el-table :data="slashList" border height="400">... -
element 表格table纵横双列表头 斜线样式处理和多级表头循环
2019-10-31 09:49:51element 表格table纵横双列表头 斜线样式处理和多级表头循环 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <!-- import CSS --> <link rel="stylesheet" href=... -
给table表格表头添加斜线
2022-01-13 14:35:51HTML代码 <td id="lineTd"> <span style="float:left;margin-bottom:-3px;">姓名</span> <span style="float:right;margin-top:-7px;">人数</span>...base64,PHN2ZyB4bWxu -
el-table表格横竖双表头,表头带斜线
2022-05-19 10:18:33实现效果 代码 <el-table :data="tableData" border> <el-table-column label="数据" align="right" width="150"> <el-table-column prop="name" label="数据指标" width="150">... -
React antd Table 实现单元格点击 表头斜线分组等功能
2021-11-22 11:21:38} } 注意: 固定分组表头的宽度,否则响应式可能会引起表头斜线错位等问题 三:添加单元格点击事件 设置选中状态 利用onCell属性为单元格添加点击事件 // 设置第一个单元格为默认选中 const [active, setActive] = ... -
excel三栏斜线表头的完美制作方法
2021-06-12 17:58:18在Excel中制作三栏斜线表头的方法有很多,今天介绍一种认为最完美最简单的制作excel三栏斜线表头的方法。请看本文教程:excel三栏斜线表头的完美制作方法。操作步骤:步骤一:边框线的添加。边框线的添加别无选择,...