IT技术博客大学习 共学习 共进步
全部 移动开发 后端 数据库 AI 算法 安全 DevOps 前端 设计 开发者

标签:Box Model

共 2 篇相关文章

IT 累计浏览 3,870

一览CSS布局标准

这篇文章梳理了CSS布局从诞生至今的完整演变脉络。作者从CSS1仅用于图文绕排的Float,讲到CSS2.1正式确立“常规流、浮动、绝对定位”三大布局支柱,为我们理解现代布局打下了基础。 核心篇幅留给了CSS3时代正在推进的五大布局标准。文章逐一解析了多栏布局、弹性盒布局、栅格布局等新方案,不仅点明了它们各自的状态和兼容性,还通过具体代码示例(比如用Flexbox轻松实现不定宽高居中)展示了这些新思路相比传统Float的简洁与灵活。 但这篇文章的价值不止于罗列技术点。作者敏锐地指出了一个关键矛盾:标准制定往往滞后于浏览器厂商的实现,开发者夹在中间饱受兼容性之苦。他更呼吁开发者不要只满足于Float或某些库,而应回归标准本身,去理解布局的原理。在低端浏览器逐渐退场的今天,这些更强大的新布局技术正是提升前端代码质量的关键。

IT 累计浏览 2,299

神奇的CSS形状

这篇讲的是如何用纯粹的CSS代码“画”出各种图形。 作者从一个直观的需求出发——不借助图片或SVG,只用CSS来创造视觉元素。文章系统地展示了多种形状的实现思路,从最简单的圆形、三角形,到复杂的对话气泡、不规则的多边形,甚至带阴影和渐变的立体效果。 关键在于对CSS基础属性(如`border-radius`、`clip-path`、`transform`)的巧妙组合与计算。文章不仅给出了代码片段,更重要的是解释了背后的几何原理和技巧,比如如何利用边框、伪元素和透明背景来构建形状。 对于前端开发者而言,掌握这些技巧不仅能减少对图片的依赖、提升页面性能,更能在图标、装饰元素等场景下实现更灵活、可缩放的视觉方案。这不仅仅是几个代码片段的堆砌,更像是一份用代码进行平面设计的创意指南。