CSSCasts: CSS libraries Plugins Tips & Tricks

Learn to craft decorative dividers using border-image and linear gradients, including butterfly images as borders, adjustable sizing, and section dividers for blog articles.

Explore how to create stunning text effects with css gradient text, image background text, and text shadow, using background-clip techniques and layered backgrounds for bold typography.

Explore how to use bootstrap display classes to customize heading sizes, experiment with display-1 through display-4, and adjust text with muted and small styles for hero sections.

Learn how to implement blockquotes in Bootstrap 4, add semantic markup with blockquote and blockquote footer for an author, and style and align quotes with simple classes.

Create and customize Bootstrap list groups using anchor links and buttons, applying active and disabled states, with list group items and badges for rich content.

Display code on your webpage using bootstrap and CDN, copy and paste source snippets, wrap them in appropriate elements, and showcase variables and sample output with safe escaping.

Learn to apply contextual classes and background classes to style rows and cells in a table, with examples such as success, warning, and danger.

Create and customize Bootstrap 4 alerts, including success, warning, and danger variants, with links and multi-line content. Apply accessible markup with roles to ensure screen readers work well across devices.

Explore how to create button groups and a button toolbar in bootstrap 4, adjust sizes, spacing, and grouping to build organized, responsive UI components.

Learn how to add header and footer to cards, control card size, align text and headings, and apply Bootstrap styling.

Explore utility classes to quickly build cards, control sizes, and align text. Learn to set widths with 25, 50, 75, and 100 percent and center or left-align content.

Explore styling Bootstrap cards: set background and outline, create inverted cards, apply color variants like primary, success, danger, and outline styles to build clean, responsive card layouts.

Learn to create a masonry cards layout in Bootstrap 4 using a simple class to produce multi-column cards with images and overlays, while noting browser support and responsive column counts.

Explore how to use Bootstrap collapse to show or hide elements with a button or link, and build accordions that manage multiple collapsibles.

Create a simple accordion using the collapse feature with cards, headers, and body blocks, wiring up collapse targets and a default open item for accessible interaction.

Master Bootstrap dropdowns by using button and anchor toggles, including split dropdowns and button groups, and control sizing and variation from drop down to drop up.

Learn how to use the CSS text-indent property to indent text, including first-line and first-paragraph indentation, adjust with pixel values, and apply class or id selectors for targeted paragraphs.

Explore rgb color units in css, showing how red, green, and blue values from 0 to 255 mix to produce colors, including hex and keyword representations.

Learn how the CSS opacity property works, apply it to text, paragraphs, and images, and use values from 0 to 1 to craft subtle visual effects.

Explore the basics of linear gradients in CSS, applying backgrounds with multiple color stops using hex or named colors, from red to yellow to blue, with default top-to-bottom direction.

Learn to control the flow direction of linear gradients in CSS, from top to bottom, bottom to top, or left to right, and apply dynamic background colors.

Explore how to create differently spaced color stops in radial gradients using CSS, assigning percentage values to red, blue, and yellow to control color distribution and background styling.

Discover how to create a repeating radial gradient in CSS by layering multiple color stops and adjusting percent values to control the gradient size and repetition across the page.

Explore the id selector in depth, its unique requirement and 100x higher importance than class selectors, and learn to use # for id and . for class.

Explore the universal selector in depth, learn how it selects all elements with the star syntax, and see how specificity and inheritance shape color, background, and layout in CSS.

Master group selectors in CSS to apply identical styles to multiple elements—group headings and other selectors for consistent color, borders, and layout across your page.

Learn how to style the focused element using the user action pseudo class selector, customize focus borders, padding, and colors, and ensure keyboard navigation with the tab key.

Explore how to use before and after pseudo selectors to insert and style content around any element, with practical examples of attributes, concatenation, and dynamic content.

Explore the document structure selector and learn to chain multiple selectors to craft powerful CSS rules, including before/after pseudo selectors, last-child and first-child, type selectors, and hover effects.

Learn to target elements by their parent-child relationships using the child combinator, and distinguish immediate children from descendants with the > selector.

Explore basic nth-child selectors to target elements by index, including even and odd patterns, first and last items, and practical examples with paragraphs, lists, and tables.

Master nth-child selectors to target list items in reverse order using last-child and even and odd patterns. Explore practical styling of sections and lists with offset techniques.

Explore absolute positioning in css, learn how elements are removed from the document flow and positioned relative to the nearest positioned ancestor or browser window, and compare with fixed positioning.