引用ジェネレータのWebサイトで作業しています。私はブートストラップを追加し、CSSコードでは、HTML要素の背景色を青緑のミックスシェードに設定する部分があります。ブートストラップはCSSコードをオーバーライドすることを決定し、コンテンツの背景色を持つページの部分を白に設定します。 あなたのCSSが後bootstrap.css
ファイルをロードされていることを確認してください:なぜ、どのように私はそれが背景色を変更するブートストラップ
var quotes = [
[
"To be prepared for war is one of the most effectual means of preserving peace.",
"George Washington"
],
[
"One man with courage is a majority.",
"Thomas Jefferson"
],
[
"National honor is a national property of the highest value.",
"James Monroe"
],
[
"The only thing we have to fear is fear itself.",
"Theodore D. Roosevelt"
],
[
"Ask not what your country can do for you, but what you can do for your country.",
"John F. Kennedy"
]
];
var currentQuote = 0;
function showNewQuote() {
\t if (currentQuote >= 5) {
\t \t currentQuote = 0; \t
\t }
\t var Quote = [quotes[currentQuote][0], quotes[currentQuote][1]];
\t document.getElementById("header").innerHTML = "\"" + Quote[0] + "\"";
\t document.getElementById("paragraph").innerHTML = Quote[1];
\t currentQuote++;
}
html {
\t background-color: #33cccc;
}
#header, #paragraph {
\t font-family: sans-serif;
\t
}
#header {
\t padding-top: 10%;
\t font-size: 60px;
}
#paragraph {
\t padding-left: 80%;
\t font-size: 20px;
}
<!DOCTYPE html>
<html>
<head>
<title>Random Quote Generator</title>
<script src = "script.js"></script>
<link rel="stylesheet" type="text/css" href="stylesheet.css">
\t <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
<body>
\t <div class = "container">
<h1 id="header">Click the button to generate a quote!</h1>
\t <p id="paragraph"></p>
\t <button type="button" class="btn btn-info" onclick="showNewQuote()">Generate New Quote</button>
\t </div>
</body>
</html>
感謝を。 5分が経過するまで、これを答えとしてマークすることはできませんが、クールダウンが終了したらマークします。それは今完全に動作します –
確かに:)あなたは歓迎です – Dekel