翡翠的断线怎么样？

Question

我很确定这是不费脑子的,但我没有找到任何示例代码片段.插入换行符的最佳方法是什么(又名好的ol/br /)？

据我所知,如果我在空行的开头放置一个"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.

有没有更好的方法来解决这个问题？(顺便说一句,我要求用图片标签做同样的事......)

Answer 1

最干净,最简单的解决方案是使用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.

Answer 2

我想到了.继续前进,<br />在那里扔一个好的'老式标签.你会成为金色的:)

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

更新:Jade现在支持仅br用于换行符.

Answer 3

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

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

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>

Answer 4

所以你知道..如果你正在提取这些信息..从你已经手动输入换行符的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

Answer 5

强大的每行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.

或者只是预先:

style pre.poem {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.