white-space 的小技巧-CSS

這裡有兩個有關於CSS的利用white-space小技巧

字串裡有 \r\n 或 \n

當原本的字串裡面有\r\n，我們又希望它們表現得如文字編輯器裡面有斷行的效果。除了使用字串替代(replace)為 <br/>的HTML Tag外， 另外一個選項就是CSS裡設定pre-line。在Tag的class中加入以下範例:

pre-line

.keep_text_newline {
  white-space: pre-line;
}

段落字首前保留空格

當段落的字首前面有空格。而在HTML Tag中的字首前空格會被忽略，如果想保留源格式中字串裡字首前空格，可用以下設定

pre

.keep_text_heading_space {
  white-space: pre;
}