Josh W Comeau·3yAn Interactive Guide to Flexbox
Flexbox is a remarkably powerful layout mode. It uses fluid principles to create a layout that flows seamlessly. When we truly understand how it works, we can build dynamic layouts that respond automatically. We'll build an intuition for how the Flexbox algorithm works, by learning about each of these properties.
Torque·4yCSS Best Practices: 16 Ways to Improve Your CSS Skills Quickly
By adhering to basic guidelines for writing CSS, you can make sure you produce clean, legible, and easily supportable code. Make your code readable and make it more comfortable to understand, maintain, and work with. If there is an existing style guide, stick with that.
Community Picks·4yHTML Cheat Sheet
HTML Cheat Sheet contains useful code examples and web developer tools, markup generators and more on a single page. These pages were created as a quick guide for those who already know how to work with these languages. The page was created in 2020 with the latest HTML5 rules and will be updated regularly.
Community Picks·4yWhy you should never use px to set font-size in CSS
CSS Tricks: Why you should never use px to set font-size in CSS is an important, and poorly understood topic. If you pick the wrong unit, you risk overriding your users’ preferences, making it stands for “root em,” and the root of a webpage is the tag.
asayer·3yA Top Collection of CSS Code Generators
Animista is one of the most acceptable code generators for creating animations using CSS. The tool provides a library of pre-made CSS animations that could be included in your work. CSS3 Generator takes care of all the vendor prefixes. OpenReplay is self-hosted for full control over your data.
LogRocket·4yThe 6 best CSS background generators
The 6 best CSS background generators are essential to any webpage, and can make or break your website design. This article will provide you with a list of the best background and pattern generators used in CSS to help you create something exciting in your web design.
freeCodeCamp·4yLearn CSS – Responsive Web Design Study Guide
Learn CSS - Responsive Web Design Study Guide Cascading Style Sheets (CSS) This study guide is filled with additional information, articles, and videos to help you understand the concepts better. The first part of the project reviews HTML elements and then moves onto CSS. This includes headings, paragraphs, images, links, and more. The body element contains all of the content for the web page. For more information, see the complete list of topics covered.
Josh W Comeau·3yColor Formats in CSS
CSS has a whole slew of different color formats: hex codes, rgb(), hsl() and lch(), the list goes on. In this tutorial, I'll take you on a tour of the different options. We'll see how they work, how we can decipher them, and how they can use them to our advantage.
Ahmad Shadeed·4yInside the mind of a frontend developer: Hero section
The most important thing here is the thinking process, not the CSS outcome, as sometimes it can get fairly straightforward to understand. In this article, I will take you into the journey of building a hero section by showing you your thought process.
LogRocket·4yCreate parallax scrolling with CSS
Parallax scrolling is a computer graphics technique in which background images move past the camera more slowly than foreground images. The technique grew out of the multiplane camera technique used in traditional animation in the 1930s. The secret to this method is to use a background image for a section and fix its position. When the user scrolls through a particular section, the background does not scroll by, but the other elements do.
Community Picks·3yCSS :is(),:where(),:has() and :not()
CSS :is() takes the specificity of the elements which has a 0 specificity no matter how many elements grouped together. This selector simply checks the presence of some element using its class. It will check whether the parent element has an input with type checkbox and it is checked.
freeCodeCamp·4yLearn Full Stack Development – HTML, CSS, JavaScript, Node.js, MongoDB
Full Stack Development - HTML, CSS, JavaScript, Node.js, MongoDB Full stack development is a term used to describe the process of developing a complete website or application from start to finish. Full stack developers must have a deep understanding of both front-end and back-end web development.
DZone·3y12 Essential Skills Your ReactJS Developers Should
This guide will explain the crucial React JS developer abilities to screen for when hiring a ReactJS developer. Read our in-depth recruiting guide to discover the greatest React skills for your team. Join the DZone community and get the full member experience.
Community Picks·3yA Virtual CSS language with enhanced syntax.
A Virtual CSS language with enhanced syntax. Efficiently build your UI and design system with HTML only. All features are pre-configured and optimized, so you can build whatever you want right away. We've provided shorthand values like, to make it easier for you to implement modern CSS effects.
asayer·4yUsing Material UI with React"
Material UI is an open-source, front-end user interface library that features components for speeding up the creation of web applications. Material UI allows the developer to customize the style and appearance of components, changing themes, typography, and appearance to give web pages a unique feel.
Angular·4yAngular v15 is now available!
Angular v15 is now available. Standalone APIs are now stable! In v14 we introduced new standalone APIs which enable developers to build applications without using NgModules. These APIs graduated from developer preview and are now part of the stable API surface. From here on we will evolve them gradually following semantic versioning.
Community Picks·4yHow to Become a Web Developer Fast and Get your First Job
Web developers are responsible for the efficiency of the codes of a website. They can use their skills to create websites for businesses or charities. FreeCodeCamp, Udemy, and Udacity have a lot of valuable web development courses that will teach everything from basic HTML and CSS skills to more advanced front-end techniques like responsive web design and javascript frameworks.
Calibre·4y8 Causes of Slow Website Loading (And How To Fix Them)
Unoptimised images and videos are the easiest places to start when looking to speed up your web page. Unoptimised fonts on your website add up to 10 seconds to your initial page rendering process. Cutting where you can with third-party scripts is a good way to improve loading speed.
