如何在 Laravel 8 的邮件模板上应用 CSS 规则?

How do I apply CSS rules on Laravel 8's mail template?

我正在尝试创建一封电子邮件,在客户下订单后发送给他们。我正在使用 Laravel 8 并使用以下命令安装它:php artisan make:mail OrderPlaced - 这创建了所有必要的文件。然后我使用:php artisan vendor:publish 并发布所有邮件 blade.php 文件:

这是我的路由文件,它已发送,因此我可以快速设计我的电子邮件的外观,而无需不断发送电子邮件:

/* Test email route */
Route::get('/mailable', function () {
   $order = \App\Models\Order::find(1);
   return new \App\Mail\OrderPlaced($order);
});

这是我的 OrderPlaced.php 邮件控制器:

public function build()
{
    return $this->markdown('emails.orders.placed')
        ->to($this->order->billing_email, $this->order->billing_name)
        ->subject($this->order->billing_name . "'s Order");
}

我的问题是我正在尝试将 CSS 应用到我的 placed.blade.php 文件。目前看起来像这样:

@component('mail::message')
    <h1>Order Received</h1>

    <p>Thank you for ordering with Mobile Mastery and we are so hyped that you decided to make us part of upgrading
    your gaming experience. Your order is being prepared and shipped currently, but in the mean time do NOT delete
    this email as you may need it, for example, to return an item. You order details are as follows:</p>

    -- OTHER ORDER RELATED STUFF --

@endcomponent

您可以看到标题有 <h1> 标签,信息有 <p> 标签,但在实际电子邮件中,只应用了 <h1> 标签和 <p> 显示在屏幕上:

任何人都可以告诉我如何有效地设置 Laravel 的 @component('mail::message') 样式或为我指出一个好的页面吗?谢谢

可能数据被转义了。可以看到邮件消息blade有这个

{{-- Body --}}
{{ $slot }}

来自文档的解释: 默认情况下,Blade {{ }} 语句会自动通过 PHP 的 htmlspecialchars 函数发送,以防止 XSS 攻击。如果您不希望您的数据被转义,您可以使用以下语法:

Hello, {!! $name !!}

阅读更多 https://laravel.com/docs/8.x/blade#displaying-unescaped-data