With the evolution of CSS, more and more resources are presented for front-end developers and with that the work ends up gaining more agility and quality. An example of this evolution is the use of logical operators in CSS references. Sentences of denial, exclusion and exclusivity are now part of life of those who understand the need to develop a layout that is fully compatible with many existing access devices.

Logical operators in Media Queries

Just as in programming, the logical operators may be used to condition the media queries using a style sheet determined according to the type of access device.

Following, we will present the three logical operators available, namely: not, or & only.

The operator NOT, as its name suggests, is used to deny a specific device. This means that it will not use a particular CSS file according to the identified device.

<link rel=”styleSheet” hef=”style.css” media=”All and (not color)” />

 

In the above code example, we are denying using the color element, thus allowing the page is also displayed in monochrome devices.

The operator OR, in turn, limits the use of various types of media in a single sentence. Its most common use is with the use of the comma (“,”).

<link rel=”styleSheet” hef=”style.css” media=”All and (color), projection and (color)” />

In the example, the comma separates the conditional of use by type of device in which the CSS is used between all sorts of colorful media and/or colorful projections.

Finally, the operator ONLY indicates that the style sheet will be used only in a particular media type.

<link rel=”styleSheet” hef=”style.css” media=”Only screen and (color)” />

 

In the example shown, only colorful and high resolution screens use the CSS file indicated.

 

Logical operators by default are used to solve problems that often rely on conditional. The main idea with its use is objectively solve a given situation. With a few lines, complex problems are solved, thus ensuring greater productivity and efficiency in development.

By , The most efficient web development environment. Create your web solutions in a fast and innovative way, reducing the development time in up to 80%. Access http://scriptcase.net and learn more.

November 5, 2015

a

You might also like…

The importance of training in the use of software

Today we are going to reflect on the importance of training in the use of software that, when explo...

A sneak peek on scriptcase 9.4.027!

Come check out all the new details for scriptcase version 9.4.027 !! This week we launched our n...

8 tips for working from home

Hello, how are you? We hope you are well! We know that the moment is difficult and many people a...

You might also like…

Get new posts, resources, offers and more each week.

We will use the information you provide to update you about our Newsletter and Special Offers. You can unsubscribe any time you want by clinck in a link in the footer of any email you receive from us, or by contacting us at sales@scriptcase.net. Learn more about our Privacy Police.