《玉中断线》怎么样？

我非常肯定这是一个显而易见的问题，但是我没有找到任何示例代码片段。 插入换行符的最佳方法是什么？

据我所知，如果我在一个空行的开头放一个“ br”，它会被呈现为 <br/>，但是如果我必须显示几行文本，那么结果代码就会非常冗长:

.poem
p
| Si chiamava Tatiana, la sorella…
br
| Noi siamo i primi, almeno lo crediamo
br
| Che un tale nome arditamente nella
br
| Cornice d’un romanzo introduciamo.
br
| E che dunque? E’ piacevole, sonoro.
br
| Lo so che a molti privo di decoro
br
| Apparirà, già fuori moda, e degno
br
| Piuttosto d’un ancella, certo segno,
br
| confessiamolo pur senza paura,
br
| di quanto s’è noialtri al gusto avversi
br
| nei nostri nomi (a non parlar di versi). |br
br
| Credemmo conquistare la cultura,
br
| e non ne abbiamo preso, in conclusione,
br
| che la ricerca dell’affettazione.

还有更好的解决办法吗？ (顺便说一句，我对图像标签也有同样的要求... ...)

81866 次浏览
小开

每行有一个 div:

p.poem
.line Si chiamava Tatiana, la sorella…
.line Noi siamo i primi, almeno lo crediamo
.line Che un tale nome arditamente nella
.line Cornice d’un romanzo introduciamo.
.line E che dunque? E’ piacevole, sonoro.
.line Lo so che a molti privo di decoro
.line Apparirà, già fuori moda, e degno
.line Piuttosto d’un ancella, certo segno,
.line confessiamolo pur senza paura,
.line di quanto s’è noialtri al gusto avversi
.line nei nostri nomi (a non parlar di versi).
.line Credemmo conquistare la cultura,
.line e non ne abbiamo preso, in conclusione,
.line che la ricerca dell’affettazione.

或者简单地用一个 pre:

样式 pre.week { font-family: ariel }

pre.poem
Si chiamava Tatiana, la sorella…
Noi siamo i primi, almeno lo crediamo
Che un tale nome arditamente nella
Cornice d’un romanzo introduciamo.
E che dunque? E’ piacevole, sonoro.
Lo so che a molti privo di decoro
Apparirà, già fuori moda, e degno
Piuttosto d’un ancella, certo segno,
confessiamolo pur senza paura,
di quanto s’è noialtri al gusto avversi
nei nostri nomi (a non parlar di versi).
Credemmo conquistare la cultura,
e non ne abbiamo preso, in conclusione,
che la ricerca dell’affettazione.
小开

我想通了。只要扔一个老式的 <br />标签进去就行了。你会成为金色的:)

p
|hey this is my <br />
|broken paragraph!

更新 : Jade 现在只支持使用 br作为换行符。

小开
最佳答案

最简单干净的解决方案是使用 style 属性 white-space: pre;，例如:

.poem
p(style='white-space:pre;')
| Si chiamava Tatiana, la sorella…
| Noi siamo i primi, almeno lo crediamo
| Che un tale nome arditamente nella
| Cornice d’un romanzo introduciamo.
| E che dunque? E’ piacevole, sonoro.
| Lo so che a molti privo di decoro
| Apparirà, già fuori moda, e degno
| Piuttosto d’un ancella, certo segno,
| confessiamolo pur senza paura,
| di quanto s’è noialtri al gusto avversi
| nei nostri nomi (a non parlar di versi). |br
| Credemmo conquistare la cultura,
| e non ne abbiamo preso, in conclusione,
| che la ricerca dell’affettazione.
小开

让你知道。.如果你把这些信息。.例如，在 SQL 数据库中，您已经手动输入了换行符(比如在表单的文本区域中) ，您可以在服务器上对输出执行以下操作

var contentParse = function(content){
content = content.replace(/\n?\r\n/g, '<br />' );
return content;
};

然后在玉器中使用

!{content}

让 Jade 知道你正在将原始的 html 插入到你要渲染的变量中

来源: https://github.com/visionmedia/jade#tag-text

小开

我可以在@haxxxton 之后做以下事情

app.use(function(req, res, next){
var contentParse = function (content){
content = content.replace(/\n?\r\n/g, '<br />' );
return content;
};
res.locals.contentParse = contentParse;
next();
});

例如，它可以用在玉模板使用函数 p!= contentParse(post.description)

小开

试试这个:

- for(var i = 0; i < 10; i++)
| hello
| world
小开

以防你在第一次搜索时没有使用年份过滤器: 如何添加玉 HTML 的 br 标签

将文本放在前面有 | 的新行上:

p first line
br
| second line
小开

这似乎不是一个答案，所以:

你也可以使用 Jade/Pug 的内联标记格式添加内联 br标记，例如:

p.
Some text on the first line.#[br]
Some text on the second line.

制作:

  <p>Some text on the first line.<br>
Some text on the second line.
</p>
小开

这也很有效。

div
pre
| this is line 1
| this is line 2
小开

给你的段落一个样式来保持换行，并在 p 行末尾加一个点:

.poem
p(style="white-space: pre-line;").
Si chiamava Tatiana, la sorella…
Noi siamo i primi, almeno lo crediamo
Che un tale nome arditamente nella
Cornice d’un romanzo introduciamo.
E che dunque? E’ piacevole, sonoro.
Lo so che a molti privo di decoro
Apparirà, già fuori moda, e degno
Piuttosto d’un ancella, certo segno,
confessiamolo pur senza paura,
di quanto s’è noialtri al gusto avversi
nei nostri nomi (a non parlar di versi).
Credemmo conquistare la cultura,
e non ne abbiamo preso, in conclusione,
che la ricerca dell’affettazione.
小开

我从 PUG 模板生成了一个 SASS 文件 我需要一个新的 each项目。
这就是对我有效的方法:

//- custom-variables.pug
//- GENERATE COLORS
each color, idx in colors
| #{idx}: #{color};
|

const pug = require("pug");


const colors = {
$primary: "#0074d9",
$secondary: "#ff4136",
$green: "green",
};


// Compile the source code
const compiledFunction = pug.compileFile("./scripts/custom-variables.pug");


console.log(compiledFunction({ colors }));
// outputs:
/*
$primary: #0074d9;
$secondary: #ff4136;
$green: green;
*/
小开 
.poem: pre(style="font-family: unset").
Si chiamava Tatiana, la sorella…
Noi siamo i primi, almeno lo crediamo
Che un tale nome arditamente nella
Cornice d’un romanzo introduciamo.
E che dunque? E’ piacevole, sonoro.
Lo so che a molti privo di decoro
Apparirà, già fuori moda, e degno
Piuttosto d’un ancella, certo segno,
confessiamolo pur senza paura,
di quanto s’è noialtri al gusto avversi
nei nostri nomi (a non parlar di versi).
Credemmo conquistare la cultura,
e non ne abbiamo preso, in conclusione,
che la ricerca dell’affettazione.

或者

.poem: p(style="white-space: pre-wrap").
Si chiamava Tatiana, la sorella…
Noi siamo i primi, almeno lo crediamo
Che un tale nome arditamente nella
Cornice d’un romanzo introduciamo.
E che dunque? E’ piacevole, sonoro.
Lo so che a molti privo di decoro
Apparirà, già fuori moda, e degno
Piuttosto d’un ancella, certo segno,
confessiamolo pur senza paura,
di quanto s’è noialtri al gusto avversi
nei nostri nomi (a non parlar di versi).
Credemmo conquistare la cultura,
e non ne abbiamo preso, in conclusione,
che la ricerca dell’affettazione.

提交答案