Menu
At first, here is the relevant parts of the code:
<head>
<style type="text/css">
#part1 {
background: url("1.jpg") no-repeat center;
background-size: cover;
}
#1-title {
color: blue;
}
</style>
</head>
<body>
<div class="jumbotron jumbotron-fluid" id="part1">
<div class="container">
<h1 id="1-title" class="display-3">The New App</h1>
<p class="lead" id="1-disc">A new app</p>
<hr class="my-4">
</div>
</div>
</body>
h1 is assigned an id of "1-title", and hence h1 text colour should be blue, but it remains black even if I use !important.
However, I tried adding a class and applying the style to it as following:
<style type="text/css">
#part1 {
background: url("1.jpg") no-repeat center;
background-size: cover;
}
.c {
color: blue;
}
</style>
and:
<h1 class="display-3 c">The New App</h1>
and it worked.
So what is the reason of that? Why can't I change the colour using the d selector?
844
The ID selector isn't working because an ID can't start with a number. Either change the ID to a letter or use the attribute selector [id='1-title'] {...}
168
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
