Loading Please Wait...
CSS functions are used to set the various CSS property. CSS value functions represent more complex data types and they may take some input arguments to calculate the return value.
selector {
property: function([argument]? [, argument]!);
}
Performs basic arithmetic calculations on numerical values.
width: calc(100% - 100px);
Calculates the smallest of a list of values.
width: min(50%, 300px);
Calculates the largest of a list of values.
width: max(50%, 300px);
Calculates the central of a minimum, central, and maximum values.
width: clamp(200px, 40%, 400px);
Uses the custom property value instead of any part of a value of another property.
:root {
--main-bg-color: pink;
}
body {
background-color: var(--main-bg-color);
}
Uses the attributes defined on HTML element.
attr(title);
Calculates the trigonometric sine of a number.
width: calc(100px * sin(45deg));
Calculates the base raised to the power of a number.
width: calc(10px * pow(5, 2));
Calculates the square root of a number.
width: calc(100px * sqrt(9));
Calculates the square root of the sum of the squares of its arguments.
width: hypot(30px, 40px);
Calculates the logarithm of a number.
width: calc(100px * log(7.389));
Calculates e raised to the power of a number.
width: calc(100px * exp(1));
How you feel about this blog:
Share this blog on:
If you find any error in the turtorials, or want to share your suggestion/feedback, feel free to send us email at: info@lynxsia.com
Contact Us
We are concern with various development process like website design & development, E-commerce development, Software development, Application development, SMS & Bulk SMS Provider, PWA Development, and many more..
Copyright © , Lynxsia IT Solutions, All rights reserved