外部引入的CSS不生效
/res/styles/global.css 被 rfs.scss 和 reboot.scss 覆盖了
我对全局字体使用了 !important (至少生效了，要不然下面的图片会是微软雅黑的字体)
但是我不希望在其他地方使用 !important
我应该如何做才能够解决这个问题？（这不是浏览器问题，我已经尝试过Firefox和Edge了）
我无法在Bing上找到我需要的结果(见文末)
我希望的效果：
实际情况：
m1.html
<!DOCTYPE html>
<html>
<head>
<title>Set (*******)</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--ICON-->
<link rel="shortcut icon" href="/favision.ico" type="images/x-icon" />
<!--Styles-->
<link rel="stylesheet" href="/res/styles/global.css" type="text/css" />
<link rel="stylesheet" href="/res/styles/index.css" type="text/css" />
<!--BootStrap-->
<link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.1/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.3.3/css/bootstrap.min.css" integrity="sha512-jnSuA4Ss2PkkikSOLtYs8BlYIeeIK1h99ty4YfvRPAlzr377vr3CXDb7sb7eEEBYjDtcYj+AjBH3FLv5uSJuXg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<!--Scripts-->
<!--BootStrap-->
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.1/js/bootstrap.bundle.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.3.3/js/bootstrap.bundle.min.js" integrity="sha512-7Pi/otdlbbCR+LnW+F7PwFcSDJOuUJB3OxtEHbg4vSMvzvJjde4Po1v4BR9Gdc9aXNUNFVUY+SK51wWT8WF0Gg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<!--Marked.js-->
<script src="https://cdn.bootcdn.net/ajax/libs/marked/9.0.0/marked.min.js"></script>
</head>
<body>
<div><p class="Title"><a href="/index.html">></a></p></div>
<div class="text" id="content">
Generating...
</div>
</body>
<script src="/res/scripts/dfetch.js"></script>
<script>
GetT('/s/logic/m1.md').then((text)=>{
document.getElementById('content').innerHTML = marked.parse(text)
})
</script>
</html>
m1.md
# Others
/res/styles/global.css
@font-face {
font-family: 'Ubuntu-Sans-Mono';
src: url("/res/fonts/UbuntuSansMono-Light derivative en-font.woff") format('woff');
font-style: normal;
font-weight: normal;
}
@font-face {
font-family: 'QiushuiShotai';
src: url(/res/fonts/QiushuiShotai.woff) format('woff');
font-style: normal;
font-weight: normal;
}
body {
font-family: 'Ubuntu-Sans-Mono', QiushuiShotai !important ;
}
p.otherTitle {
font-size: 3.2rem;
color: #202020FF;
text-shadow: 1px 1px #A0A0A0FF;
margin: 0;
}
p {
color: #FFFFFFFF;
}
a:link{
color: #C0FFFF;
text-decoration-line: none;
}
a:visited{
color: #C0FFFF;
text-decoration-line: none;
}
a:hover{
color: #C0FFFF;
text-decoration-line: none;
}
a:active{
color: #C0FFFF;
text-decoration-line: none;
}
hr {
height: 4px;
}
h1,h2,h3,h4,h5,h6 {
font-weight: normal;
font-size: 3.2rem;
color: #202020FF;
text-shadow: 1px 1px #A0A0A0FF;
margin: 0;
}
index.css
:root {
--text-both-margin: 2em;
--div-both-margin: 1em;
}
body {
background-image: url(/res/Aimags/main.jpg);
background-position: center center;
background-attachment: fixed;
background-size: cover;
background-repeat: no-repeat;
}
div {
color: #FFFFFFC0;
margin: 0.5em;
text-shadow: 1px 1px #FFC0FF;
margin-left: var(--div-both-margin);
margin-right: var(--div-both-margin);
font-size: 1.6rem;
}
div.text {
border-style: solid;
border-radius: 12px 12px;
border-width: 2px;
border-color: #FFFFFFC0;
background-color: #FFC0FF40;
padding: 1rem;
}
div.text > p{
margin: 0;
}
p.Title {
font-size: 3.2rem;
color: #202020FF;
text-shadow: 1px 1px #A0A0A0FF;
margin: 0;
}
dfetch.js
async function GetD(url){
const response = await fetch(url)
return await response.json()
}
async function GetT(url){
const response = await fetch(url)
if(response.ok){
return await response.text()
}else{
return await response.statusText
}
}
function WriteD(dat,did){
for (const p in dat){
e = document.createElement('p')
e.className = 'links'
l = document.createElement('a')
l.href = dat[p]
l.innerHTML = p
e.appendChild(l)
document.getElementById(did).appendChild(e)
}
}
附即将更新的仓库：https://github.com/Qiong-Mengzi/Qiong-Mengzi.github.io
