首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Laravel Excel垂直居中对齐

在Laravel Excel中,你可以使用WithStrictParsingShouldAutoSize特性,以及setAlignment方法来实现单元格内容的垂直居中对齐。以下是一个示例:

首先,确保你已经安装了Laravel Excel:

代码语言:javascript
复制
composer require maatwebsite/excel

然后,创建一个新的导出类,例如MyExport.php

代码语言:javascript
复制
<?php

namespace App\Exports;

use Maatwebsite\Excel\Concerns\WithStrictParsing;
use Maatwebsite\Excel\Concerns\ShouldAutoSize;
use PhpOffice\PhpSpreadsheet\Style\Alignment;

class MyExport implements WithStrictParsing, ShouldAutoSize
{
    public function headings(): array
    {
        return [
            'Header 1',
            'Header 2',
            'Header 3',
        ];
    }

    public function array(): array
    {
        return [
            ['Data 1', 'Data 2', 'Data 3'],
            ['Data 4', 'Data 5', 'Data 6'],
            ['Data 7', 'Data 8', 'Data 9'],
        ];
    }

    public function registerEvents(): array
    {
        return [
            AfterSheet::class => function (AfterSheet $event) {
                $sheet = $event->sheet->getDelegate();

                // 设置垂直居中对齐
                $alignment = new Alignment();
                $alignment->setVertical(Alignment::VERTICAL_CENTER);

                // 应用对齐方式到所有单元格
                $sheet->getStyle('A1:C3')->getAlignment()->applyFromArray($alignment);
            },
        ];
    }
}

在这个示例中,我们创建了一个名为MyExport的导出类,实现了WithStrictParsingShouldAutoSize特性。我们还定义了一个registerEvents方法,该方法在导出完成后触发,并设置所有单元格内容的垂直居中对齐。

最后,你可以使用Laravel Excel的export方法导出数据:

代码语言:javascript
复制
use App\Exports\MyExport;
use Maatwebsite\Excel\Facades\Excel;

Excel::download(new MyExport(), 'my_export.xlsx');

这将生成一个包含垂直居中对齐内容的Excel文件。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

【CSS】vertical-align 垂直对齐 ( 块级元素对齐 | 行内元素 行内块元素对齐 | 基线对齐 | 垂直居中 | 顶部对齐 | 底部对齐 )

一、取消文本域拖拽 块级元素对齐 : 浏览器居中对齐 : 设置 margin: 0 auto; 样式 ; 内部水平居中 : 设置 text-align: center; 样式 ; 内部垂直居中 : 行高...height = 内容高度 line-height ; vertical-align 垂直对齐 , 不能用于块级元素 , 只能用于 行内元素 / 行内块元素 ; vertical-align 垂直对齐...p , 则 p 的下半部分在图片的下方 ; vertical-align: baseline; 垂直居中 : 图片中心位置 与 文字中线 对齐 ; vertical-align: middle; 顶部对齐...垂直对齐代码示例 ---- 代码示例 : <!.../ vertical-align: baseline; } .two { /* 中线对齐 - 图片中心与文字中心对齐 垂直居中*/ vertical-align: middle

3.6K30
  • Css 垂直居中

    “44 年前我们就把人类送上月球了,但现在我们仍然无法在 CSS 中 实现垂直居中。”...然而如果要对一个元素进行垂直居中,可能光是想想就令人头皮发麻了。 长久以来,为了解决这一绝世难题,前端开发者们殚精竭虑,琢磨出了各种解决方法,可惜大多数并不实用。...在本篇攻略中,我们将探索现代 CSS 的强大威力,以全新的思路去攻克各种场景下的垂直居中难题。...基于绝对定位 我们先来看一个早期的垂直居中方法,它要求元素具有固定的宽度和高度: main {    position: absolute;    top: 50%;    left: 50%;...虽然没有垂直居中效果,但也是完全可以接受的。 Flexbox 的另一个好处在于,它还可以将匿名容器(即没有被标签包裹的文本节点)垂直居中。

    2.8K10

    div垂直居中 css div盒子上下垂直居中

    div垂直居中 css div盒子上下垂直居中,让DIV盒子在任何浏览器中任何分辨率的显示屏浏览器中处于水平居中和上下垂直居中。...div垂直居中常用于单个盒子,如一个页面里只有一个登录布局,使用div css让这个登录布局水平和css垂直居中。 这里介绍一种最简单兼容性最好的水平居中与上下垂直居中的方法。...solid #00F } /*css注释:为了方便截图,对CSS代码进行换行*/ DIV水平居中和上下垂直居中...水平垂直居中原理介绍 这里使用了绝对定位position:absolute,使用left和top设置对象距离上和左为50%,但如果设置50%,实际上盒子是没有实现居中效果,所以又设置margin-left...:-200px;margin-top:-100px;,这里有个技巧是,margin-left的值是宽度一半,margin-top的值也是对象高度一半,同时设置为负,这样就实现了水平和垂直居中。

    2.8K50

    css图片居中(水平居中和垂直居中)

    css图片居中(水平居中和垂直居中) css图片居中分css图片水平居中和垂直居中两种情况,有时候还需要图片同时水平垂直居中,下面分几种居中情况分别介绍。..."" src="https://www.baidu.com/img/baidu_jgylogo3.gif" style="display: inline-block;" /> css图片垂直居中...img/baidu_jgylogo3.gif" style="display: inline-block; vertical-align: middle;" /> 利用table实现图片垂直居中...利用table的方法是利用了table的垂直居中属性,代码如下: 这里使用display: table;和display: table-cell;来模拟table,这种方法并不兼容IE6/IE7,IE67...absolute; left:50%; top: 50%; margin-left: -60px;margin-top: -20px;" /> 移动端可以利用flex布局实现css图片垂直居中

    4.9K20
    领券