A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_URI::$config is deprecated
Filename: core/URI.php
Line Number: 102
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Router::$uri is deprecated
Filename: core/Router.php
Line Number: 128
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$benchmark is deprecated
Filename: core/Controller.php
Line Number: 83
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$hooks is deprecated
Filename: core/Controller.php
Line Number: 83
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$config is deprecated
Filename: core/Controller.php
Line Number: 83
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$log is deprecated
Filename: core/Controller.php
Line Number: 83
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$utf8 is deprecated
Filename: core/Controller.php
Line Number: 83
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$uri is deprecated
Filename: core/Controller.php
Line Number: 83
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$exceptions is deprecated
Filename: core/Controller.php
Line Number: 83
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$router is deprecated
Filename: core/Controller.php
Line Number: 83
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$output is deprecated
Filename: core/Controller.php
Line Number: 83
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$security is deprecated
Filename: core/Controller.php
Line Number: 83
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$input is deprecated
Filename: core/Controller.php
Line Number: 83
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$lang is deprecated
Filename: core/Controller.php
Line Number: 83
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$db is deprecated
Filename: core/Loader.php
Line Number: 397
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_DB_mysqli_driver::$failover is deprecated
Filename: database/DB_driver.php
Line Number: 372
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$email is deprecated
Filename: core/Loader.php
Line Number: 1284
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: Warning
Message: ini_set(): Session ini settings cannot be changed after headers have already been sent
Filename: Session/Session.php
Line Number: 303
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: Warning
Message: session_set_cookie_params(): Session cookie parameters cannot be changed after headers have already been sent
Filename: Session/Session.php
Line Number: 328
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: Warning
Message: ini_set(): Session ini settings cannot be changed after headers have already been sent
Filename: Session/Session.php
Line Number: 355
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: Warning
Message: ini_set(): Session ini settings cannot be changed after headers have already been sent
Filename: Session/Session.php
Line Number: 365
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: Warning
Message: ini_set(): Session ini settings cannot be changed after headers have already been sent
Filename: Session/Session.php
Line Number: 366
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: Warning
Message: ini_set(): Session ini settings cannot be changed after headers have already been sent
Filename: Session/Session.php
Line Number: 367
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: Warning
Message: ini_set(): Session ini settings cannot be changed after headers have already been sent
Filename: Session/Session.php
Line Number: 368
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: Warning
Message: ini_set(): Session ini settings cannot be changed after headers have already been sent
Filename: Session/Session.php
Line Number: 426
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: Warning
Message: session_set_save_handler(): Session save handler cannot be changed after headers have already been sent
Filename: Session/Session.php
Line Number: 110
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: Warning
Message: session_start(): Session cannot be started after headers have already been sent
Filename: Session/Session.php
Line Number: 137
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$session is deprecated
Filename: core/Loader.php
Line Number: 1284
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$form_validation is deprecated
Filename: core/Loader.php
Line Number: 1284
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$pagination is deprecated
Filename: core/Loader.php
Line Number: 1284
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property Blog::$zip is deprecated
Filename: core/Loader.php
Line Number: 1284
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$load is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$benchmark is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$hooks is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$config is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$log is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$utf8 is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$uri is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$exceptions is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$router is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$output is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$security is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$input is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$lang is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$db is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$email is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$session is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$form_validation is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$pagination is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
A PHP Error was encountered
Severity: 8192
Message: Creation of dynamic property CI_Loader::$zip is deprecated
Filename: core/Loader.php
Line Number: 932
Backtrace:
File: /www/wwwroot/SINHCOMS/VT/main/application/controllers/Blog.php
File: /www/wwwroot/SINHCOMS/VT/main/index.php
Vismrit Tech | Home Startup
Theresa Underwood
Sep 10, 2021
9 min to read
CSS Selectors are extremely useful for defining a query on a subset of the elements on a page. Querying allows us to do one of two things.
CSS Selectors are extremely useful for defining a query on a subset of the elements on a page. Querying allows us to do one of two things - declare a style to apply on the set of elements in a CSS stylesheet, or receive a list of HTML elements programatically according to the query, using the querySelector method.
Here is an example - if we would want to color all paragraphs in the document blue, we can simply write:
<style>
p {
color: blue;
}
</style>
<p>I am blue</p>
<p class="example">I am also blue</p>
<p id="last" class="example">I am blue as well</p>
The CSS selector "p" will select all "p" (paragraphs) in the page.
We can add constraints on the query and apply a different CSS to some elements using a more specific selector. Let's color all "p" elements that have the "example" class with green. Note that in this example, the order of the CSS definitions does not matter since the second selector is more specific - therefore it will override the less specific CSS definition.
<style>
p.example {
color: green;
}
p {
color: blue;
}
</style>
<p>I am blue</p>
<p class="example">I am green now</p>
<p id="last" class="example">I am also green now</p>
We can repeat the same process but this time adding an ID selector instead of the class selector.
<style>
p#last {
color: red;
}
p.example {
color: green;
}
p {
color: blue;
}
</style>
<p>I am blue</p>
<p class="example">I am green now</p>
<p id="last" class="example">And now I am red</p>
CSS selectors also support the comma tag, for applying the same style block to a number of elements. This example colors h1, h2 and h3 in blue and h4, h5 and h6 in red.
<style>
h1, h2, h3 {
color: blue;
}
h4, h5, h6 {
color: red;
}
</style>
<h1>h1 title</h1>
<h2>h2 title</h2>
<h3>h3 title</h3>
<h4>h4 title</h4>
<h5>h5 title</h5>
<h6>h6 title</h6>
Descendant & Child Selectors Apart from specifying an element type, an ID and/or a class name, we can also create selectors that select a specific child only if it is contained in a specific hierarchy. For example, let's say we want to color all the < strong >
<style>
.strongblue strong {
color: blue;
}
</style>
<p>This is the <strong>first</strong> sentence.</p>
<p class="strongblue">This is the <strong>second</strong> sentence.</p>
There are two types of child selectors - an ancestor selector like this one, and a direct child selector that only selects the first level of hierarchy from the parent element that was selected. Here is the same code but with a direct child selector:
<style>
.strongblue > strong {
color: blue;
}
</style>
<p>This is the <strong>first</strong> sentence.</p>
<p class="strongblue">This is the <strong>second</strong> sentence.</p>
If the < strong > .strongblue and the strong element.
<style>
.strongblue > strong {
color: blue;
}
</style>
<p>This is the <strong>first</strong> sentence.</p>
<p class="strongblue">This is the <a><strong>second</strong></a> sentence.</p>
querySelector and querySelectorAll methods HTML5 introduced the new document.querySelector and document.querySelectorAll methods which allows us to run the same selectors and receive the first element that corresponds to the selector, or a list of elements, depending on the method you use.
Let's see an example:
<p class="nice">This is a nice paragraph.</p>
<p class="nice">This is another nice paragraph.</p>
<p>This is a standard paragraph.</p>
<script>
// this code colors the first nice paragraph in blue
var firstNiceParagraph = document.querySelector(".nice");
firstNiceParagraph.style.color = "blue";
</script>
Exercise This page does not have an exercise yet. You are welcome to contribute one by sending me a pull request:
https://github.com/ronreiter/interactive-tutorials
Related Post
Demand generation is a constant struggle for any business. Each marketing strategy you employ has...
Learn more
Organic search has the potential to capture more than 40 percent of your gross revenue...
Learn more
Demand generation is a constant struggle for any business. Each marketing strategy you employ has...
Learn more
Sophie Asveld
February 14, 2021
Email is a crucial channel in any marketing mix, and never has this been truer than for today’s entrepreneur. Curious what to say.
Ariana Gerad
February 14, 2021
Email is a crucial channel in any marketing mix, and never has this been truer than for today’s entrepreneur. Curious what to say.
Sophie Asveld
February 14, 2021
Email is a crucial channel in any marketing mix, and never has this been truer than for today’s entrepreneur. Curious what to say.