有關字符串集及其用途的示例,請參閱使用 LESS 字符串集屬性和內容方法
經(jīng)過多次困惑,我發(fā)現(xiàn)這已經(jīng)過時了,并且自 Chrome 版本 39 以來就沒有實現(xiàn)過,盡管它顯然在 LESS 中繼續(xù)存在。
教科書的用例是獲取樣式的最新匹配內容并將其放入變量中,以便隨后可以由頁眉或頁腳中的string(varname)
使用。
例如,以下代碼會將 h1
標記的內容放入 .header
類的任何內容中,以及 varname
的值隨著每個連續(xù)的 h1
h1 { string-set: chapterTitle; } .header { content: string(chapterTitle); }
現(xiàn)代的等價物是什么?
需要 Polyfill。 Pagedjs 可以做到,而且顯然也更少。
但是,在我在問題中引用的代碼中,我錯誤地捕獲了該值。應該如下圖所示。您可以將 string-set
視為一個采用兩個值的函數(shù):符號名稱和符號值的來源。
捕獲值后,該字符串就可供使用,并且可以使用 string(SYMBOL_NAME)
獲取該值。在這種情況下,每次 H1 元素或遇到 chapterTitle
類的元素時都會捕獲一個值。
h1 { string-set: chapterTitle content(); } .header { content: string(chapterTitle); }
與應用程序類似,但能夠捕獲整個元素圖的是 position: running(ELEMENT_NAME)
,當類將其應用于元素時,會從流中刪除該元素及其所有子元素并使其可用供 content: element(ELEMENT_NAME);
使用。元素圖而不是字符串的優(yōu)點是您可以使用 、
、樣式化容器甚至
code> 和
來啟動正在運行的頁眉/頁腳的“文本”。
如果這是不熟悉的 CSS,那是因為沒有瀏覽器實現(xiàn)了這部分標準。但 pagedjs 會為你填充它。