Emil Krautmannecodersdev.hashnode.dev·Apr 27, 2024Unleash the Power of CSS VariablesIn the ever-evolving world of web development, CSS (Cascading Style Sheets) has been a constant companion, providing developers with the means to style and enhance the visual appearance of websites. However, with the introduction of CSS variables, a ...DiscussCSS
brian treesebriantreese.hashnode.dev·Nov 24, 2023Alpha Transparency in CSS Custom PropertiesCustom properties have been a pretty big deal for us who use CSS regularly. Many of us are probably starting to use them quite a bit, especially as part of a color or theming system. They really work great for this. But what about when we need alpha ...Discussrgba color function
Eva Chenim1010ioio.hashnode.dev·Sep 24, 2023#09 原生的 Css 變數,基本與進階應用↓ 今日學習重點 ↓ 了解如何設定 CSS 變數,並且使用它們 CSS 變數(CSS Variables)可以讓人在整個網站的樣式中輕鬆重複使用相同的值,更輕鬆地調整網站的外觀,同時保持一致性。以往 CSS 要使用變數必須透過 Sass (SCSS) 或 Less 等預處理器才能實現,但現在有了原生的 CSS 變數,已開始廣泛運用在網頁上了。 今天,就讓我們來了解如何使用 CSS 變數吧! 基礎知識 定義變數 在CSS中,可以使用--前綴來定義變數。而上一篇有提過 :root 選擇器,指...DiscussSuper Easy CSS,極度簡單:寫出好的 CSS,從零開始前端生涯CSS
Lavanya Cheemakurthylavanyacheemakurthy.hashnode.dev·Aug 30, 2023A way of dynamic usage of CSS variables along with Context API in ReactIn this article, we will cover, how to set CSS variable values from JSX and how to use Context API so that nested child will be able to change the same variable values. Assume we have to set the background color as three different colors based on one...Discuss·54 readsReact
Mba-Atanga Judejudemba.hashnode.dev·Jun 12, 2023CSS Variables: The Secret Weapon for Easy and Less Redundant Styling!Have you ever been styling your webpage and noticed you need the same: background-color font settings (size, color, family) margin and padding settings For many different elements? And you become bored by the numerous times you have to specify t...Discuss·22 likes·88 readsHTML5
Matt LawrenceforHTML All The Thingshtmlallthethings.hashnode.dev·Nov 22, 2022CSS Variables – What Are They & How to Use ThemWhat Is a CSS Variable? CSS custom properties are often referred to as CSS variables. They allow you to set and store values within them for use throughout your stylesheet(s). For example, you could have a primary-color variable that is set to the he...Discuss·34 likes·245 readsCSS
Stavros Ioannidisistavros.dev·Nov 13, 2022How to make simple slideshow using cool CSS and JS featuresHello. Today I'm making a simple slideshow using cool CSS and JS features. I'm gonna be using: CSS variables CSS transformations CSS functions CSS grid JS Proxy The HTML <div class="slideshow"> <div class="slides-container"> <div class="slid...Discuss·2 likes·403 readsjavascript proxy
James Uyikingjames.hashnode.dev·Oct 11, 2022How To Use CSS VariablesCSS is the source of beauty behind every website, when writing css some values are usually repeated like the color, padding or margin and they sometimes require changes, imagine having to change the color value in a large CSS file where it has been a...Discuss·2 likes·144 readsCSS
Onolunose Oko-Oseonose.hashnode.dev·Aug 13, 2022Day 51: Learning CSS Variables by Building a City Skyline (Part 10)Welcome back to my Journey of Learning CSS Variables by building a City Skyline. Here are the steps I took today: Added sky as a second class to the .background-buildings element. I am going to make a background for the skyline. Gave the sky cla...Discuss·8 likes·719 readsHTML5
Onolunose Oko-Oseonose.hashnode.dev·Aug 12, 2022Day 50: Learning CSS Variable by Building a City Skyline (Part 9)Another day to show you 10 steps I took learning CSS Variables by building a city skyline. Filled in the windows with the secondary color for this building (var(--window-color1). Also added a margin of 10% to give the windows some space. Added d...Discuss·26 readsHTML5