我是 bootstrap 的新手，我正在尝试以下内容。我制作了 3 列，每列有 2 个段落。我使用 CSS 为 medium-sized-screens 、 large-sized-screens 和 extra-small-screens 定义了配色方案。
最初我看到的颜色是橙色。那正是我所期望的颜色。但是当我将屏幕从大尺寸调整为超小尺寸时，我看不到任何颜色变化。我不知道它的原因？我犯的错误是什么？
<html>
<head>
<title></title>
<link rel='stylesheet' type='text/css' href='css/bootstrap.css' />
<style>
.col-md-4 {
background-color: yellow;
}
.col-xs-4 {
background-color: red;
}
.col-lg-4 {
background-color: orange;
}
</style>
</head>
<body>
<div class='container'>
<div class='row'>
<div class='col-lg-4 col-xs-4 col-md-4'>
<p> You shout it out, But I can't hear a word you say !</p>
<p> Beqarar karke humein yun na jaiye..Aapko hamari kasam laut aaiye</p>
</div>
<div class='col-lg-4 col-xs-4 col-md-4'>
<p> I have started liking David Guetta's work !</p>
<p> I really liked his song 'Titanium' :-)</p>
</div>
<div class='col-lg-4 col-xs-4 col-md-4'>
<p> I am enjoying the saturday afternoon and it is 3:24 by clock.</p>
<p> How about going for a movie ?</p>
</div>
</div>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src='js/bootstrap.js' />
</body>
最佳答案
你的规则没有使用媒体查询，它们总是被添加，所以最后一个总是生效。
如果你想修改它们现有的样式，你应该考虑使用带有 Bootstrap 的 less 文件的 mixins。
关于html - 为什么当我调整屏幕大小时配色方案没有改变？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25460865/