css_inline
是一個高性能庫,用於將CSS插入HTML“樣式”屬性。
該庫專為準備HTML電子郵件或將HTML嵌入第三方網頁等方案而設計。
例如,板條箱像這樣轉換HTML:
<html> <head> <樣式> h1 {顏色:藍色; } </style> </head> <body> <h1>大文字</h1> </body> </html>
進入:
<html> <頭> </head> <body> <H1 style =“顏色:藍色;”>大文本</h1> </body> </html>
使用Mozilla伺服項目的可靠組件
來自style
和link
標籤的Inline CSS
刪除style
和link
標籤
解決外部樣式表(包括本地文件)
可選地緩存外部樣式表
在Linux,Windows和MacOS上工作
支持HTML5&CSS3
Python,Ruby,JavaScript,C和WebAssembly模塊的綁定,可以在瀏覽器中運行。
命令行接口
如果您想嘗試css-inline
,則可以檢查Websembly驅動的操場以立即查看結果。
要將其包括在項目中,請在項目的Cargo.toml
中的“依賴關係”部分中添加以下行。
[依賴項] CSS-Inline =“ 0.14”
最低支持的RUST版本為1.65。
const html:&str = r#“ <html> <head> <head> <syte> h1 {color:blue;} </style> </head> </head> <hod> <h1>大文本</h1 > </h1> </hody> </body> </ html>“#; fn main() - > css_inline :: result <()> {讓inlined = css_inline :: inline(html)(html)?; //與inlined html一起做某事,例如發送emailok((())}
請注意, css-inline
會自動添加缺少的html
和body
標籤,因此輸出是有效的HTML文檔。
另外,您可以將CSS插入HTML片段,並保留原始結構:
const fragment:&str = r#“ <ain> <h1>你好</h1> <部分> <p>誰是i </p> </pection> </section> </main>”#; const css :&str = r# “ p {color:red;} h1 {color:blue;}”#; fn main() - > css_inline :: result <()> {讓inlined = css_inline :: inline_fragment(fragment,css) ? )}}
可以使用CSSInliner::options()
來配置css-inline
,以實現構建器模式:
const html:&str =“ ...”; fn main() - > css_inline :: result <()> {讓inliner = css_inline :: cssinliner :: option()。load_remote_remote_remote_remote_stylesheets() = inliner.inline(html)? ;; //與html一起使用的東西,例如發送emailok((())}}
inline_style_tags
。指定是否從“樣式”標籤內聯CSS。默認值: true
keep_style_tags
。指定在內線後是否保留“樣式”標籤。默認值: false
keep_link_tags
。指定在內聯後是否保留“鏈接”標籤。默認值: false
base_url
。基本URL用於解析相對URL。如果您想從文件系統加載樣式表,請使用file://
方案。默認值: None
load_remote_stylesheets
。指定是否應加載遠程樣式表。默認值: true
cache
.指定外部樣式表的緩存。默認值: None
extra_css
。額外的CSS被內聯。默認值: None
preallocate_node_capacity
。先進的。在解析過程中,預處理HTML節點的能力。當您對HTML文檔中的節點數量進行估計時,這可以提高性能。默認值: 32
您還可以通過添加data-css-inline="ignore"
屬性來跳過html標籤的css插入:
<頭> <樣式> h1 {顏色:藍色; } </style> </head> <body> <! - 下面的標籤不會收到其他樣式 - > <h1 data-css-inline =“忽略”>大文本</h1> </body>
data-css-inline="ignore"
屬性還允許您跳過link
和style
標籤:
<頭> <! - 下面的樣式被忽略 - > <樣式data-css-inline =“ ignore”> h1 {color:blue; } </style> </head> <body> <h1>大文本</h1> </hody>
另外,您可以使用data-css-inline="keep"
屬性來防止style
刪除。如果您想在單獨的style
標籤中保留@media
詢問以獲取@Media的詢問:
<頭> <! - 下面的樣式未刪除 - > <樣式data-css-inline =“ keep”> h1 {color:blue; } </style> </head> <body> <h1>大文本</h1> </hody>
即使keep_style_tags
選項設置為false
,此類標籤也將保存在結果的HTML中。
如果您想從文件系統加載樣式表,請使用file://
方案:
const html:&str =“ ...”; fn main() - > css_inline :: result <()> {讓base_url = css_inline :: url :: url :: parse(“ file:// styles/email/email /”).expect (“無效的URL”);讓Inliner = CSS_INLINE :: CSSINLINER :: option()。base_url(some(base_url))。build(build(); let inlined = inliner.inline(html); //與Inlined html,html,html,html,html,html,例如發送電子郵件(())
為了解決遠程樣式表,可以實現自定義解析器:
#[derive(debug,默認)] pub struct struct customStyleSheetResolver; inpper css_inline :: stylesheetheetresolver for CustomStylesStyleSheetHeetResolver {fn retireve(&self,soperation:&str) - > css_inline ::> css_inline :: result <string> result <string> erres. un.uns.un.unsupport seffort {不支持“)}}}} fn main() - > css_inline :: result <()> {讓inliner = css_inline :: cssinliner :: option :: options()。resolver( std :: sync :: sync :: arc :: arc :: arc :: arc :: new(castureStyleSheetResolver) ).build(); ok((())}
您還可以緩存外部樣式表,以避免過多的網絡請求:
使用std :: num :: non necorize;#[cfg(feature =“ stylesheet -cache”)] fn main() - > css_inline :: result <()> {讓inliner = css_inline :: cssinliner :: cssinliner ::緩存(//這是lru cachecss_inline :: stylesheetcache :: new(nonzorizize :: new(5)new(5).expect(“無效cache size”))。build()此處用於測試目的#[cfg( not(feature =“ stylesheet -cache”))
默認情況下禁用緩存。
css-inline
通常會在數百微秒內引入HTML電子郵件,儘管結果可能隨輸入複雜性而變化。
css-inline==0.14.1
:
基本: 6.44 µs ,230字節
現實1: 128.59 µs ,8.58 kb
現實2: 81.44 µs ,4.3 kb
GitHub頁面: 224.89毫秒,1.81 MB
這些基準是在M1 max上使用rustc 1.78
進行的,可以在css-inline/benches/inliner.rs
中找到。
安裝cargo
:
cargo install css-inline
以下命令並行多個文檔中的CSS。所得文件將被保存為inlined.email1.html
和inlined.email2.html
:
css-inline email1.html email2.html
有關可用選項的完整詳細信息,您可以使用--help
標誌:
css-inline --help
如果您有興趣了解該庫的創建方式及其在內部的工作方式,請查看以下文章:
生鏽的箱子
Python結合
如果您有與此圖書館有關的任何疑問或討論,請加入我們的Gitter!
該項目是根據MIT許可證的條款獲得許可的。