1 views collected around this technical thread.
This tutorial explains the CSS shape() function, its syntax, and how it extends clip‑path and offset‑path capabilities, allowing developers to craft responsive, irregular shapes using percentages, variables, and arc commands, with practical code examples and browser compatibility notes.
This article walks you through creating a stylish input field with a gradient border using CSS background‑clip, covering the underlying principle, hover and focus effects, smooth transitions, and providing complete, ready‑to‑use code snippets.
The article examines the drawbacks of writing raw CSS, explains how preprocessors, naming conventions, modular approaches, CSS‑in‑JS, and atomic‑CSS frameworks like Tailwind and UnoCSS address redundancy, maintenance, and scalability, and provides best‑practice recommendations for modern front‑end development.
This guide outlines a step‑by‑step self‑learning path covering HTML, CSS, and PHP, offering practical advice, structured phases, and career‑building strategies to help beginners become competent web developers in a systematic and achievable manner.
This article explains the semantic and practical differences between the CSS declarations border: 0 and border: none, covering their behavior, use‑cases, performance impact, compatibility with older browsers and assistive technologies, and provides code examples for each.
This article explains what CSS container queries are, how they differ from media queries, provides practical code examples and syntax details, and summarizes current browser support on both desktop and mobile platforms, helping developers create adaptable component layouts.
This article explains how to use CSS Grid's auto-fill and auto-fit functions with the repeat and minmax syntax to create responsive card layouts that automatically adapt to different screen widths without media queries, including code examples and guidance on when to choose each option.
This guide explains how to create and inject a Tampermonkey userscript that hides both the top banner and article‑page advertisements on Juejin, adjusts the navigation layout, and restores the site’s original clean appearance for a better reading experience.
This article introduces the new CSS view() function that calculates element dimensions from viewport data using min, ideal, and max values, enabling fluid, breakpoint‑free layouts, and covers its syntax, practical examples, browser support, and how to implement feature detection for modern web design.
This article compiles and explains a set of Tailwind CSS utility classes that often cause confusion—covering dimensions, typography, spacing, truncation, background handling, shadows, transform origins, pseudo‑classes and pseudo‑elements—while providing code examples and plugin recommendations for efficient frontend development.
The 2024 CSS update introduces ten powerful features—scrollbar‑gutter, scrollbar‑color, ::target-text, ruby‑align/position, relative color syntax with light‑dark(), native details accordions, content‑visibility, font‑size‑adjust, transition‑behavior, @property with step‑value functions, and offset‑path/position—enabling smoother layouts, dynamic theming, performance gains, richer typography, and complex animations without JavaScript.
This article explains how to analyze Bilibili's homepage banner, extract its image layers and transformation data, and then implement the same effect using pure JavaScript as well as Angular, React, and Vue, providing complete source code and a step‑by‑step guide.
This article showcases six playful front‑end Easter‑egg techniques—including a ghost button, Matrix‑style digital rain, melt animation, console treasure map, reverse‑scroll effect, and real‑time ASCII camera—each accompanied by concise HTML/JavaScript code and usage cautions for developers.
This article explains why CSS position:fixed normally anchors to the viewport, describes the challenges in complex layouts, and demonstrates several CSS tricks—such as using transform, perspective, filter, backdrop-filter, and contain:paint—to make a fixed element position relative to a specific parent, while also covering best‑practice considerations.
This article demonstrates how to embed a hidden Facebook Like button that automatically registers likes as the user moves the mouse, using HTML, CSS positioning, JavaScript event handling, and the Facebook SDK, while keeping the element invisible to the user.
This article explains why increasing a card's border width on hover can cause layout jitter and presents three CSS techniques—transparent initial border, dynamic padding adjustment, and flex‑centered layout—to achieve a smooth transition without shifting inner content.
This article provides an in‑depth tutorial on CSS Grid, covering responsive layouts with media queries, auto‑fit/minmax tricks, implicit versus explicit grids, column spanning, alignment properties, place‑content shortcuts, repeat syntax, masonry rows, and useful online resources, all illustrated with practical code examples.
This article explains the challenges of Right‑To‑Left (RTL) layout adaptation, compares three implementation strategies—including CSS logical properties, transform scaling, and manual RTL code—and demonstrates how tools like rtlcss, Tailwind, and Ant Design can automate or simplify RTL support for modern web projects.
This article explains why long English strings may not wrap in browsers, analyzes the default white-space behavior, and provides practical CSS solutions—including word-break, white-space, overflow-wrap, and word-wrap—along with usage recommendations for mixed Chinese‑English content.
This article explains how to create a custom PostCSS plugin for Vite that converts pixel units to viewport width units, covering meta tag setup, plugin configuration, TypeScript implementation, handling multi‑value properties, and troubleshooting conversion issues.