今天早上我正在查看某人网站的实现,看到他们通过 LINK 标记中的 data-uri 定义 CSS。
我理解将图像放入 data-uri 并将其包含在 CSS 中的合理性,但我不清楚为什么有人会选择以这种方式包含 CSS,而您可以轻松地内联。
我确实看到他们在链接中有一个 ID。难道他们是从 DOM 中动态获取这个 CSS,然后将它用于动态生成元素的“样式”的值?我不是前端专家,但我相信还有其他方法可以做到这一点。
这是HTML:
<link id="noteanywherecss" media="screen" type="text/css" rel="stylesheet" href="data:text/css,.note-anywhere%20.closebutton%7Bbackground-image%3A%20url%28chrome-extension%3A//bohahkiiknkelflnjjlipnaeapefmjbh/asset/deleteButton.png%29%3B%7D%0A.note-anywhere%20%7Bbackground-color%3A%20%23FFF046%3B%7D%0A.note-anywhere%20%7Bcolor%3A%20%23000066%3B%7D%0A.note-anywhere%20%20.edit%20%7Bfont-family%3A%20Arial%2C%20Helvetica%2C%20sans-serif%3B%7D%0A.note-anywhere%20%20.edit%20%7Bfont-size%3A%2014px%3B%7D%0A.note-anywhere%20.timestamp%20%7Bbackground-color%3A%20%23DDBB00%3B%7D%0A.note-anywhere%20.timestamp%20%7Bcolor%3A%20%23FFFFFF%3B%7D">