DEV Community

FSCSS tutorials for FSCSS tutorials

Posted on • Edited on

How to Use FSCSS in CSS

FSCSS can be written inside of any HTML style tag, but
You must import the FSCSS js file to your HTML head tag

<haed>
<script src='https://wbf.tiiny.site/scripts/0/FS/fs.ex25.js'></script>
</script>
</head>
<style>
//test FSCSS
</style>
Enter fullscreen mode Exit fullscreen mode

See example on codepen

Why Should I use FSCSS instead of CSS

I think FSCSS is using Shorthand methods instead of longhand methods,
And it makes you access to some simple method of writing CSS text,
Example:
1
CSS
-webkit-...
-moz-...
-ms-...
-o-...

FSCSS
-*-...
2
CSS
transform: rotate(50deg);
transform: skew(50deg);
filter: hue-rotate(50deg);

FSCSS
%3(transform: rotate,
transform: skew,
filter: hue-rotate[(50deg);])

3
CSS max-height: 500000000px;
FSCSS max-height: %8(5[0])px;
4
CSS color: rgba(100,100,100,0.8)
FSCSS color: rgba(%3([100,])0.8)
5
CSS var(--...)
FSCSS $...!
Continuation

FSCSS provides many built-in modules which contain useful functions.

ProFile ⇶



Follow up

❤️❤️❤️

Heroku

Simplify your DevOps and maximize your time.

Since 2007, Heroku has been the go-to platform for developers as it monitors uptime, performance, and infrastructure concerns, allowing you to focus on writing code.

Learn More

Top comments (0)

Image of Docusign

🛠️ Bring your solution into Docusign. Reach over 1.6M customers.

Docusign is now extensible. Overcome challenges with disconnected products and inaccessible data by bringing your solutions into Docusign and publishing to 1.6M customers in the App Center.

Learn more