27
4
I have a Node Js-Express Based app and using handlebars template to design a structure for Nodemailer HTML body. I tried including the CSS file multiple ways for the same, but still none of the styles are being applied to the HTML.
我有一个基于Node Js-Express的应用程序，并使用把手模板来设计一个Nodemailer的HTML主体结构。为了同样的目的，我尝试了多种方式来包含css文件，但是仍然没有一种样式被应用到HTML。
My current project structure is something like this:
我目前的项目结构是这样的：
个人中心
文章发布
退出- backend
- src
- helpers
- templates
- emailTemplate.handlebars
- public
- styles.css
- app.js
The app.js is defined to use the handlebars like this:
App.js被定义为使用如下所示的把手：
const express = require('express');
const app = express();
app.use(express.static(path.join(__dirname, '/public')));
The handlebar template goes like this:
车把模板如下所示：
<html>
<head>
<title>Update Project Details</title>
{{#each css}}
<link rel="stylesheet" href="../../public/{{this}}">
{{/each}}
</head>
<body>
<h1>{{headerMessage}}</h1>
<p>{{message}}</p>
<p>
{{bodyText}}
<div class="row">
<div class="side">
<button class="edit"> Edit Details </button>
</div>
<div class="main">
<button class="archive"> Archive Product </button>
</div>
</div>
</body>
</html>
As the nodemailer functions and mail is received, the HTML content is rendered from the HandleBar template inside the mail body, but without any CSS or styling.
当nodemailer运行并接收邮件时，将从邮件正文中的Handlebar模板呈现HTML内容，但不使用任何CSS或样式。
I also tried keeping the CSS file inside the same folder as the template, but no luck. Not sure where I'm going wrong. Any help to resolve the same will be highly appreciated.
我还尝试将css文件保存在与模板相同的文件夹中，但没有成功。不知道我错在哪里了。任何帮助解决这一问题的人都将受到高度赞赏。
the only issue that I see here is the actual linking up of the style sheet to your DOM. If you look at the app.use in your app.js where it says:
我在这里看到的唯一问题是样式表与DOM的实际链接。如果您查看app.js中的app.use，它会显示：
app.use(express.static(path.join(__dirname, '/public')));
that means that any so called "public" files, images, local js, style are stored in the public folder, and that is the new relative path for all headers. So no matter where your ejs or html file is, the relative path to the style sheet will always be from the top level down of your public folder. This makes it more dynamic and the only thing you have to change is:
这意味着任何所谓的“公共”文件、图像、本地js、样式都存储在公共文件夹中，这是所有头文件的新相对路径。因此，无论您的ejs或html文件在哪里，样式表的相对路径都将始终是从您的公用文件夹的顶层向下。这让它更有活力，你唯一需要改变的是：
<link rel="stylesheet" href="../../public/{{this}}">
to:
致：
<link rel="stylesheet" href="{{this}}">
Simple as that. Hope this makes sense, happy coding!
就这么简单。希望这是有意义的，快乐的编码！
i used internal style. i placed the css code on the head section it worked.
我用的是内部风格。我把css代码放在头部分，它起作用了。
Thanks for the explanation. After changing, it still doesn't seem to work :/
谢谢你的解释。换了以后，似乎还是不管用：/
@enthu_dev Hey there, try just doing <link rel="stylesheet" href="style.css"> I dunno what you mean by the {{this}} tag so just flush it out with the first section in this comment.
@enthu_dev嘿，试着只做我不知道您所说的{{this}}标记是什么意思，所以只需用这条评论的第一部分将其清除。
Still not work. Though I found a weird flex. I inspected the email body HTML in the browser, and seems like even the class="" are removed from every <div> or any HTML tags, forget about including the CSS. Not understanding why is this happening. At least the class names should be there while inspecting the code.
还是不管用。虽然我发现了一种奇怪的弯曲。我检查了浏览器中的电子邮件正文HTML，似乎甚至从每个 No issues, Thank you anyway for looking into this. 没问题，不管怎样，谢谢你调查这件事。 hey, did you find any solution for this ? 嘿，你有什么办法解决这个问题吗？ As it’s currently written, your answer is unclear. Please edit to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers in the help center. 正如它目前所写的，你的答案并不清楚。请编辑以添加更多详细信息，以帮助其他人了解这是如何解决提出的问题的。你可以在帮助中心找到更多关于如何写出好答案的信息。或任何HTML标记中都去掉了class=“”，忘记了包括css。不明白为什么会发生这种事。在检查代码时，至少应该有类名。
27
4
0
这两个文件之间的主要区别是什么:styles.xml (res\values\styles.xml) 和 styles.xml (res\values-v21\styles.xml ？ 针对旧的and
我正在尝试将按钮样式设置为看起来像我在 Android Full Width ICS style Minimalist Bottom ButtonsViews 中询问的那些按钮. 我已经成功了，有兴趣
只是想检查一下: 如果我有 Style.css 和 Style.min.css(在同一目录中)并且我的 html 页面引用了 Style.css，浏览器/服务器是否会下载 Style.min.css？
就目前而言，这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持，但这个问题可能会引起辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the he
从上面的问题，我认为这会相对容易，但我找不到任何关于如何向“样式”下拉菜单添加样式的文档。谁能把我推向正确的方向？ 最佳答案 样式下拉列表会根据主题的typography.css 文件中的类自动填充。
我有两种风格 还有这个 如果我尝试在这样的对象上使用第二个 编译器抛出这个错误: 错误 16 Style 对象不能影响它所应用的对象的 St
我想知道是否有关于在 Lisp 中使用标签的标准做法。我一直在弄乱这里第一个答案中描述的算法的 Lisp 实现 Generating permutations lazily我当前的版本使用标签来分解部
我想以编程方式获取样式为“ButtonBar”的 LinearLayout 的背景颜色。 我试过用LinearLayout的getBackgroundColor，没找到方法。 有人有想法吗？问候 最
我在扩展 javax.swing.text.DefaultStyledDocument 的类中遇到间歇性问题。该文档正在发送到打印机。大多数情况下，文档的格式看起来是正确的，但有时却并非如此。看起来格
我想将所有元素设为边框。我想这样做: * { box-sizing: border-box; } 如何使用 React 的内联样式做到这一点？我不想在每个组件中都写这个规则... 最佳答案 这是不
当我创建一个 Android 应用程序项目时，我在 (android:theme="@style/AppTheme") 上的 AndroidManifest.xml 中出现错误 找不到与给定名称匹配的
一种风格ol.layer.Vector可以设置为 ol.style.Style ，样式函数或 ol.style.Style 的数组.数组的用途和作用——与仅传递 ol.style.Style 相比目的
我的意思是内部风格 #div {color:red;} document.getElementsByTagName('style').innerHTML 不工作... document.style
http://synergine.net/rain.php 你好。我试图清除 .ripple div 中所有元素的样式属性，但没有成功: function contact(level){ focus_
我使用 vue 和 v-for 循环来创建跨度。以下是使用 bootstrap4 的背景颜色的一种样式的成功: {{ group }} export default {
有没有办法只存储元素的当前样式状态，这样我就可以搞砸样式然后再重置它？ 类似于(虽然这不起作用):http://jsfiddle.net/843Pj/ var el=document.getEleme
我正在尝试将 tinymce 配置为不允许在 style 属性中使用 css 样式。 我只想允许一种样式，即文本装饰。这是一个类似的问题 http://tinymce.moxiecode.com/pu
我对style.css做了一些修改，上传到网上。但是它没有显示我需要的结果。即它仍然采用旧的 style.css 代码。 我可以离线查看更改，但是当我给它完整的 href 链接时，它没有显示必要的结果
我添加到 web 文件夹下的样式文件夹似乎没有被我的 JSP 上的调度程序 servlet 映射。我明白了 WARN : org.springframework.web.servlet.PageNot
是否有任何用于 JQuery 数据表的 Metro Style CSS 样式插件？ 最佳答案 看看here 或者您可以自己创建一个。 Metro 风格很容易用 Segoe 字体复制 关于jquery
我是一名优秀的程序员,十分优秀！