亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

為什么不應用CSS類?

為什么不應用CSS類?

拉風的咖菲貓 2023-08-18 16:40:23
你能告訴我為什么不應用 css 類嗎??我imported的 cssexternal文件是這樣的。@import url("https://gist.githubusercontent.com/eirikbakke/1059266/raw/d81dba46c76169c2b253de0baed790677883c221/gistfile1.css");像這樣使用export default function App() {  return (    <div className="someclass">      <h1 className="someclass">Hello CodeSandbox</h1>      <h2>Start editing to see some magic happen!</h2>    </div>  );}這是我的代碼 https://codesandbox.io/s/priceless-turing-x62pz?file=/src/styles.css
查看完整描述

2 回答

?
瀟湘沐

TA貢獻1816條經驗 獲得超6個贊

這是因為外部 css 文件被解釋為文本而不是 css 文件

The resource from “https://gist.githubusercontent.com/eirikbakke/1059266/raw/d81dba46c76169c2b253de0baed790677883c221/gistfile1.css” was blocked due to MIME type (“text/plain”) mismatch (X-Content-Type-Options: nosniff


查看完整回答
反對 回復 2023-08-18
?
阿波羅的戰車

TA貢獻1862條經驗 獲得超6個贊

我認為 GitHub 不允許在其他地方使用其原始托管文件,因此 Github 已阻止來自跨域的請求。

這是服務器端配置,您無法在 Github 服務器上啟用 CORS。

另一種方法是將文件托管在某些 CDN 中或下載文件并將其保存在本地。

我發現的另一種選擇是通過 JS 下載文件的內容,然后將其附加為樣式元素。

我從未在 React 中工作過,但我相信您更清楚保存下載文件功能的最佳位置。

function loadCssDynamically(fileUrl){

? ? // read text from URL location

? ? var request = new XMLHttpRequest();

? ? request.open('GET', fileUrl, true);

? ? request.send(null);

? ? request.onreadystatechange = function () {

? ? ? ? if (request.readyState === 4 && request.status === 200) {

? ? ? ? ? ? var type = request.getResponseHeader('Content-Type');

? ? ? ? ? ? if (type.indexOf("text") !== 1) {

? ? ? ? ? ? ? ?var style = document.createElement('style');

? ? ? ? ? ? ? ?style.innerHTML = request.responseText;

? ? ? ? ? ? ? ?document.head.appendChild(style);

? ? ? ? ? ? ? ?// console.log(request.responseText);

? ? ? ? ? ? ? ?// return request.responseText;

? ? ? ? ? ? }

? ? ? ? }

? ? }

}


var file = "https://gist.githubusercontent.com/eirikbakke/1059266/raw/d81dba46c76169c2b253de0baed790677883c221/gistfile1.css";

loadCssDynamically(file);


查看完整回答
反對 回復 2023-08-18
?
qq_遁去的一_1

TA貢獻1725條經驗 獲得超8個贊

重要提示:rawgit.com 即將關閉。在這里閱讀有關其他替代方案的更多信息 - https://rawgit.com/

因此,這與您的代碼無關。另一種方法是復制要點 url 并將其粘貼到https://raw.githack.com/中,它將提供可用于運行示例的鏈接。

我使用你的鏈接來獲取此鏈接,https://gist.githack.com/eirikbakke/1059266/raw/d81dba46c76169c2b253de0baed790677883c221/gistfile1.css在你的 css 中應用此鏈接可以工作。

工作沙箱 [https://codesandbox.io/s/old-paper-lkdse]


查看完整回答
反對 回復 2023-08-18
  • 2 回答
  • 0 關注
  • 187 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號