bootstrap css：我可以參考CDN和文件夾路徑在同一頁面嗎？

我的引導文件引用我的HTML從CDN：bootstrap css：我可以參考CDN和文件夾路徑在同一頁面嗎？

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css">

我也有從文件夾路徑在HTML自己的自定義CSS文件參考：

<link rel="stylesheet" href="css/mystyles.css">

但好像樣式規則從我的自定義CSS文件不起作用。這是提供參考的非法方式嗎？什麼應該是正確的方式？

這是我自己的CSS樣式：

.row-header { 
margin:0px auto; 
padding:0px auto; 
} 

.row-content { 
margin:0px auto; 
padding:50px 0px 50px 0px; 
border-bottom:1px ridge; 
min-height:400px; 
} 

.row-footer { 
backgroud-color:#AfAfAf; 
margin:0px auto; 
padding:20px 0px 20px 0px; 
} 

.jumbotron { 
padding:70px 30px 70px 30px; 
margin:0px auto; 
backgroud:#7986CB; 
color:floralwhite; 
} 

address { 
font-size:80%; 
margin:0px; 
color:#0f0f0f; 
}

來源

2016-09-13 izengod

確保您在引導樣式後包含您的樣式！ –

@sebastianbrosch它不是這樣;已經以適當的方式安排。 – izengod

在控制檯中是否有任何錯誤？ – Vucko

試試這個你HTML

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/> 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css"> 
    <link rel="stylesheet" href="css/myCustom.css"> 
    <title>Test</title> 
</head> 
    <body> 
    <div calss="row-header">Header Content</div> 
    <div class="row-content">Row Content</div> 
    <div class="jumbotron"><p><a class="btn btn-lg btn-primary" href="#fork">Fork this fiddle</a></div> 
    <address>Address</address> 

    <div class="custom"> 
      <p>Put me to the right on the browser</p> 
    </div> 
    <div class="row-footer">Footer Content</div> 
    <!--scripts at the bottom--> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <!--//scripts--> 
    </body> 
</html>

，併爲你的CSS

html, body, div, span, applet, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, 
del, dfn, em, img, ins, kbd, q, s, samp, 
small, strike, strong, sub, sup, tt, var, 
b, u, i, center, 
dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td, 
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary, 
time, mark, audio, video { 
    margin: 0px; 
    padding: 0; 
    border: 0; 
    font-size: 100%; 
    font: inherit; 
    vertical-align: baseline; 
} 
.custom { 
    float: right; 
} 
.row-header { 
margin:0px auto; 
padding:0px auto; 
} 

.row-content { 
margin:0px auto; 
padding:50px 0px 50px 0px; 
border-bottom:1px ridge; 
min-height:400px; 
} 

.row-footer { 
#backgroud-color:#AfAfAf; 
background-color: #afafaf; 
margin:0px auto; 
padding:20px 0px 20px 0px; 
} 

.jumbotron { 
padding:70px 30px 70px 30px; 
margin:0px auto; 
#backgroud:#7986CB; 
background: #7986CB; 
color:floralwhite; 
} 

address { 
font-size:80%; 
margin:0px; 
color:#0f0f0f; 
}

這會幫助你。將代碼複製並粘貼到新文件並進行測試。我希望這能幫到您。

來源

2016-09-13 08:49:01

問題是肯定的與自定義CSS文件的引用。當我把我的css代碼放在HTML裏面的內時，它工作正常;正如我們在jsfiddle中看到的那樣。 – izengod

您是否刪除了@ sebastianbrosch正在談論的'！important'？你不會這麼做。同時檢查你的CSS擴展。 –

ahhh問題在於CSS擴展。我使用的是崇高的文本，默認擴展名爲cs文件的.cs文件，原因不明。 @Jay Star謝謝指出！ – izengod

bootstrap css：我可以參考CDN和文件夾路徑在同一頁面嗎？

回答

相關問題