那隻熊居然眨眼了

因為我的留言區出現了右衣，他的部落格是使用bear blog，由於對Bear blog有點好奇，我看了看bear blog的官網，看到了一隻熊與Bear，是一個主打載入很快的部落格平台，沒有追蹤沒有程式（Javascript，意味著就算使用者禁用Javascript網頁一樣可以正常使用）
只有你寫的文字，在任何裝置上都可以有很好的瀏覽視覺，而且相當輕量

挺好的

最後寫了一句話

用你的熊手發布一些驚人的東西ᕦʕ •ᴥ•ʔᕤ

然後，我看到這隻熊

用你的熊手發布一些驚人的東西ᕦʕ •ᴥ•ʔᕤ

就這隻，他眨眼了

用你的熊手發布一些驚人的東西ᕦʕ -ᴥ-ʔᕤ

好酷！怎麼就眨眼了！
然後我順手打開了Devtools，恩？

::before

這什麼鬼？！沒有元素，也不是圖片啊？熊哪裡來？！
從後台動態載入的嗎？也不像啊，也沒有Javascript，那怎麼搞的？


yeee在網頁裡面用別人元素應該還好吧awa但很有趣的說

偵錯工具

不知怎麼的，Chrome提示我在Console輸入$0可以追蹤該元素，然後就跳出了我點擊的那項元素出來
阿我還是沒找到問題啊？
然後Chrome就告訴我獲得了Devtools徽章讓我可以建立Google Developer Platform 標誌設定檔

酷東西。

那還有哪裡有問題？

我看到元素的原始碼

<a class="bear flex" href="https://herman.bearblog.dev/praise-for-bear/" target="_blank" style="text-decoration: none; color: inherit;"></a>

有個class叫做bear
肯定有什麼
然後就奔著css，阿他沒有css檔案，是直接寫在<head>裡面的<style>
然後我就看到了

.bear { font-weight: 400; font-family: "Menlo"; white-space: nowrap; display: inline-block; } .flex::before { content: "ᕦʕ •ᴥ•ʔᕤ"; animation: blink 10s infinite; } .flex:hover::before { content: "ᕙʕ ಠᴥಠʔᕗ"; animation: none; } .upgrade:hover .flex::before { content: "ᕙʕ ಠᴥಠʔᕗ"; animation: none; text-decoration: underline; } @keyframes blink { 0%, 96% { content: "ᕦʕ •ᴥ•ʔᕤ"; } 97%, 100% { content: "ᕦʕ -ᴥ-ʔᕤ"; } }

居然把內容寫在Style裡面！！！酷欸
好啦可能只是我沒見識過