今天早上我正在查看某人网站的实现，并看到他们是通过LINK标签中的数据uri定义CSS。
我理解将图像放入数据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">
答案 0 :(得分：6)
它似乎来自NoteAnywhere chrome插件而不是你所在的任何网站。 Chrome开发人员API中存在一个错误，当插入为chrome-extension://的CSS时，会破坏引用插件（chrome.tabs.insertCSS部分）的url（）属性。它在一年前得到解决，所以你可能不会再看到这种解决方法了。