css conditional rules: when / else

Conditional rules are nothing but css-based attributes; Which are applied on the basis of specific conditions. Therefore, the condition can be true or false and the phrase or model is executed based on it. These rules eventually follow certain principles and begin with the @ sign.

Conditional rules in css

In this programming language, three conditional rules are created:

@support
@media
@document

The function of this conditional rule is to check the support of a particular feature in your browser.

Check the performance of css conditional rules

• @support
  The function of this conditional rule is to check the support of a particular feature in your browser.
• @media
  As the name of this conditional law implies; It is related to the media.
  In this condition, first the length and width of your device or your browser is checked and the appropriate style is applied according to it.
• @document
  In this conditional rule, a specific style is reviewed, tested and applied for only one url.
  Rule when / else

But there is a new proposal to apply conditional rules. One of the currently used rules is when / else.

New ways to define @media rules

There are now new ways to design media that allow you to use semantic rules to suit your needs. For example, for another photo, you do not need to define the minimum or maximum value.

How to use when / else in @media

The reason for paying attention to the conditional law of the media is that it is used a lot and it is important for the site to be responsive. In designing the site, if you have encountered this issue, be sure to visit @media to define your rules. Due to the increasing knowledge of technology, css conditional rules have also been updated. To be able to create clean, attractive and shorter code. when else is the result of this development in the field of css conditional rules. To use this conditional rule, you must write the phrase when after @ and before media. Then write the condition and finally the applicable rules and phrases.

Is the when / else rule only applicable to the conditional media rule?

If you’ve been a fan of when / else so far and are worried about using it in other rules. We have to promise you the possibility of using this law in the same three conditions rule. Interestingly, when / else can be used with more than one conditional rule.

Possibility of use conditionally

We must first examine and explain its conditionality. Being conditional means being able to use a rule or condition within the CSS defined for a class or function. For example, for the cart-bottom class, you set the background color to blue and the text color to white, set to 10px border-radius at the four corners. But the important point is its padding on screens with different sizes. This is 3px for mobile, 13 pixels for desktop. To do this, after defining the main and fixed css, it is enough to define a conditional rule with when else and put the necessary condition and results in it.