摘要本文将带你穿越回Web的“远古时代”了解网页从纯文本到精美视觉盛宴的演变历程。从CSS1的诞生到CSS2的布局革命再到CSS3模块化架构的横空出世我们将用通俗易懂的方式讲述CSS的“前世今生”。本文还将解答小白常问的“CSS到底有几个版本”“CSS3和CSS2有什么区别”“为什么CSS3还没有完全完成”等疑惑。读完这一篇你将对CSS3有一个宏观而清晰的认知为后续实战打下坚实的基础。一、网页的“远古时代”没有CSS的日子有多痛苦如果你是在1990年代做网页设计你会经历这样一番场景——你写了一个HTML页面上面有标题、段落、图片但页面看起来就像是Word文档一样字是黑色的、背景是白色的、所有内容从上到下排成一条直线。如果你想改变文字颜色对不起你得在每个标签里写font colorred。如果你想调整位置得用表格table来“冒充”布局一个页面写下来几百行代码都是家常便饭。想象一下一个简单的博客页面你要给每个段落的每个文字设置颜色、字体大小光是font标签就能绕地球好几圈。代码和内容混在一起改一个颜色要改几十处维护起来简直是噩梦。这就是网页“远古时代”的真实写照。二、CSS的诞生1996年一场“分离革命”2.1 CSS是什么CSS全称是Cascading Style Sheets中文叫层叠样式表。“层叠”这个听起来有点学术的名字其实想表达的意思是多个样式规则可以“层层叠加”到一起最后合并生效就像几张透明的塑料片叠在一起最终呈现出组合效果。当然你暂时可以简单把它理解为“给HTML穿衣服”——HTML负责网页的内容结构CSS负责让这些内容变得好看。1994年挪威科学家Håkon Wium Lie他也是Opera浏览器的联合创始人之一与浏览器工程师Bert Bos联手开始设计一种全新的样式语言。经过两年多的努力1996年12月17日W3C万维网联盟正式发布了CSS1规范。在CSS1中已经包含了字体相关属性、颜色与背景属性、文字属性、盒模型相关属性等基础样式控制。2.2 CSS11996年从零到一的突破CSS1带来的三大革命性变化变革说明样式与内容分离将样式代码单独写在style标签或外部.css文件中HTML只负责结构层叠机制多个样式规则可以“叠加”生效优先级明确的制度让样式控制灵活可控盒模型雏形将网页元素视为“盒子”通过控制margin、padding、border来管理布局2.3 CSS21998年定位与浮动的布局时代1998年5月CSS2正式发布。它在CSS1的基础上增加了定位positioning和浮动float两大重要特性让网页布局有了质的飞跃。同时CSS2还带来了伪类和伪元素:hover、:active、:first-letter等让交互状态有了样式媒体类型支持可以为屏幕screen、打印机print设置不同的样式绝对和相对定位position: absolute和position: relativeCSS2.12004-2007年是对CSS2的修订和纠错版本成为了此后十多年使用最广泛的CSS版本。三、CSS3的横空出世模块化的大革命3.1 为什么需要CSS3随着Web技术的飞速发展设计师对视觉表现的需求越来越强烈——圆角、阴影、渐变、动画、响应式布局……这些在CSS2时代几乎无法优雅实现往往需要依赖图片和JavaScript的“曲线救国”。而CSS2的规范本身已经变得庞大臃肿——一个超长的规范文档浏览器厂商实现起来困难重重。W3C面临一个问题是等所有功能都完善了再统一发布一个新版本还是先发布一部分让开发者先用上W3C选择了后者。这就是模块化Modularization的核心思路。3.2 模块化的本质分而治之CSS3不像CSS1或CSS2那样是一个“大而全”的单一规范文档。相反它被拆分成了几十个独立的模块modules每个模块专门负责一类功能选择器模块Selectors Level 3背景与边框模块Backgrounds Borders Level 3颜色模块Color Level 3文本效果模块Text Level 32D/3D变换模块Transforms Level 1过渡模块Transitions Level 1动画模块Animations Level 1弹性盒子模块Flexible Box Layout Level 1网格布局模块Grid Layout Level 1媒体查询模块Media Queries Level 3……还有更多模块化的好处显而易见分步推进不同模块可以按自己的节奏发展不需要等所有模块都完成才能使用独立实现浏览器可以选择优先实现某些热门模块如flex、border-radius灵活升级以后可以单独升级某个模块而不影响其他模块降低门槛开发者可以按需学习不必一次性掌握所有内容3.3 CSS3的时间线时间里程碑事件1999年CSS3开始制订2001年5月23日W3C完成CSS3工作草案2010年CSS3作为CSS 3.0标准版本正式发布2011年至今各模块逐步演进部分模块至今仍在更新中所以你会发现CSS3不是一个“已完成的成品”而是一个持续演进的生态系统。3.4 常见疑惑解答Q1CSS3为什么不一次性发布完A因为Web技术迭代太快如果等所有模块都完善了再发布新技术早就被其他方案取代了。模块化让优秀特性可以立即投入使用。Q2CSS4是什么存在吗A目前W3C还没有正式发布CSS4这个整体版本名称。CSS4的概念更多是指各个模块的“Level 4”规范例如选择器模块有Selectors Level 4媒体查询模块有Media Queries Level 4等。Q3CSS3所有模块现在都支持了吗A核心模块如选择器、背景边框、Flexbox、Grid等主流浏览器已完全支持。但一些较新的特性如conic-gradient、scroll-timeline等仍需检查 caniuse.com 上的支持情况。四、CSS3到底带来了什么总结来说CSS3为网页设计带来了革命性的五大能力提升1. 强大的选择器体系CSS3新增了属性选择器、结构伪类选择器:nth-child()、:nth-of-type()、否定伪类:not()等无需靠类名和ID就能精准选中目标元素。2. 华丽的视觉效果圆角border-radius、阴影box-shadow、text-shadow、渐变linear-gradient、radial-gradient、透明度opacity、rgba()……告别了图片时代。3. 现代化的布局方案Flexbox弹性盒子和CSS Grid网格布局彻底解放了开发者一行display: flex就能实现过去十几行代码才能完成的垂直居中。4. 鲜活的动画交互transition和animation让网页从“静态”变成“动态”加上transform的变换能力网页交互体验提升到了前所未有的高度。5. 响应式设计能力媒体查询media可以根据不同设备屏幕尺寸动态加载不同样式真正实现了“一套代码适配所有屏幕”。一句话总结如果说CSS2解决了“能不能布局”那么CSS3真正解决了“好不好看”和“灵不灵活”的问题。五、浏览器的那些“小脾气”私有前缀与兼容性5.1 什么是私有前缀有时候你会看到一些CSS代码像这样.box { -webkit-border-radius: 8px; /* Chrome, Safari, Edge */ -moz-border-radius: 8px; /* Firefox */ border-radius: 8px; /* 标准写法 */ }这些-webkit-、-moz-就是私有前缀vendor prefixes。当某个CSS3属性还是“实验性”状态时浏览器厂商会用私有前缀来测试和实现等到标准敲定、浏览器正式支持后开发者就可以只写标准版本了。浏览器内核私有前缀对应浏览器WebKit-webkit-Chrome、Safari、EdgeGecko-moz-FirefoxTrident-ms-IE已淘汰Presto-o-Opera已淘汰5.2 如何查询兼容性CSS3特性很多不同浏览器的支持情况参差不齐。推荐使用caniuse.com查询——输入属性名即可看到全球主流浏览器支持情况的色块图绿色表示支持红色表示不支持黄色表示部分支持。5.3 好消息核心CSS3特性已全面支持目前border-radius、box-shadow、flex、grid、transition、transform、animation、media等核心CSS3特性Chrome、Firefox、Edge、Safari等现代浏览器均已原生支持开发者已经不需要再手动添加大量私有前缀。但像conic-gradient锥形渐变这类较新的特性建议先查caniuse确认兼容情况。六、CSS3的核心模块一览以下是CSS3最常用、开发者必须掌握的模块分类视觉效果类边框圆角border-radius——卡片、按钮必备阴影box-shadow/text-shadow——层次感随手就来渐变linear-gradient/radial-gradient/conic-gradient透明度opacity/rgba()动画与交互类2D/3D变换transform——平移、旋转、缩放、倾斜、3D透视过渡transition——属性的平滑变化动画animation/keyframes——精细化动画控制布局类弹性盒子Flexbox——一维布局的终极利器网格布局CSS Grid——二维布局的王牌选手多列布局column-*——报纸式多栏排版样式装饰类多背景多个url()背景剪裁与原点background-clip/background-origin/background-size自定义字体font-face响应式类媒体查询media——跨设备适配的核心视口单位vw、vh、vmin、vmax七、实操初体验第一个CSS3样式让我们动手写一点代码感受CSS3的魅力。新建一个HTML文件!DOCTYPE html html langzh-CN head meta charsetUTF-8 titleCSS3 卡片效果 - 带详细注释/title style /* 卡片样式 */ .card { width: 300px; /* 固定宽度 */ padding: 20px; /* 内边距让内容不贴边 */ /* ---------- 圆角 ---------- */ /* 标准圆角属性所有现代浏览器都支持 */ border-radius: 16px; /* ---------- 背景处理 ---------- */ /* 后备背景色当浏览器不支持渐变时显示纯色兼容 IE8/9 等旧浏览器 */ background-color: #667eea; /* 带浏览器前缀的渐变兼容旧版 WebKit如 Safari 5.1-6 */ background-image: -webkit-linear-gradient(135deg, #667eea 0%, #764ba2 100%); /* 标准渐变语法支持 IE10、Chrome 26、Firefox 16 等 */ background-image: linear-gradient(135deg, #667eea 0%, #764ba2 100%); /* ---------- 盒子阴影 ---------- */ /* 参数水平偏移 垂直偏移 模糊半径 颜色 */ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2); /* ---------- 过渡动画 ---------- */ /* 让 transform 和 box-shadow 的变化平滑过渡持续 0.3 秒缓动函数 ease */ transition: transform 0.3s ease, box-shadow 0.3s ease; /* 为旧版 Safari / Chrome 添加过渡前缀可选但更保险 */ -webkit-transition: -webkit-transform 0.3s ease, box-shadow 0.3s ease; } /* 鼠标悬停时的效果 */ .card:hover { /* 放大卡片scale(1.02) 表示放大 2%视觉上微微浮起 */ transform: scale(1.02); /* 兼容旧浏览器的前缀写法 */ -webkit-transform: scale(1.02); /* 加深阴影让悬浮感更明显 */ box-shadow: 0 20px 35px rgba(0, 0, 0, 0.3); } /* 卡片标题样式 */ .card h3 { color: white; /* 白色文字 */ margin: 0 0 10px 0; /* 上右下左去除上边距下边距留 10px */ /* 文字阴影增加立体感水平2px垂直2px模糊4px半透明黑色 */ text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3); } /* 卡片正文样式 */ .card p { color: rgba(255, 255, 255, 0.9); /* 接近白色但略透明柔和 */ line-height: 1.5; /* 1.5倍行距提升阅读舒适度 */ } /style /head body !-- 一个简单的卡片容器展示 CSS3 的核心特性 -- div classcard h3✨ CSS3 初体验 ✨/h3 p圆角、渐变、阴影、过渡——只需要几行CSS3代码一个精美的卡片就诞生了br 把鼠标放上来试试放大 阴影加深/p !-- 提示如果背景没有渐变色说明浏览器太旧会显示后备的纯紫色背景 -- /div /body /html这就是CSS3的魅力——几行代码一个引人注目的视觉作品。而你过去可能需要使用图片、大量的JavaScript和复杂的定位才能勉强实现。把这段代码复制到一个.html文件中用浏览器打开然后把鼠标放在卡片上感受一下平滑的过渡效果。八、总结CSS从1996年的CSS1实现样式与内容分离到1998年的CSS2引入定位与浮动布局再到CSS3以模块化架构拆分为圆角、渐变、Flex、Grid、动画等独立模块持续演进彻底解决了早期网页样式冗余、布局困难的问题。CSS3带来了强大的选择器、华丽的视觉效果、现代化的布局方案、鲜活的动画交互以及响应式设计能力核心特性已被现代浏览器全面支持让网页从单调文档进化为精美且动态的视觉作品。如果这篇文章帮你解决了实操上的困惑别忘记点击点赞、分享也可以留言告诉我你遇到的其它问题我会尽快回复。动手练习是掌握编程最快的方法请务必亲手敲一遍本文的所有示例代码并截图保存你的成果。你的关注是我坚持原创和细节共享的力量来源谢谢大家。
从“长相丑”到“美如画”——CSS前世今生与CSS3重磅登场
发布时间：2026/5/28 16:35:53
摘要本文将带你穿越回Web的“远古时代”了解网页从纯文本到精美视觉盛宴的演变历程。从CSS1的诞生到CSS2的布局革命再到CSS3模块化架构的横空出世我们将用通俗易懂的方式讲述CSS的“前世今生”。本文还将解答小白常问的“CSS到底有几个版本”“CSS3和CSS2有什么区别”“为什么CSS3还没有完全完成”等疑惑。读完这一篇你将对CSS3有一个宏观而清晰的认知为后续实战打下坚实的基础。一、网页的“远古时代”没有CSS的日子有多痛苦如果你是在1990年代做网页设计你会经历这样一番场景——你写了一个HTML页面上面有标题、段落、图片但页面看起来就像是Word文档一样字是黑色的、背景是白色的、所有内容从上到下排成一条直线。如果你想改变文字颜色对不起你得在每个标签里写font colorred。如果你想调整位置得用表格table来“冒充”布局一个页面写下来几百行代码都是家常便饭。想象一下一个简单的博客页面你要给每个段落的每个文字设置颜色、字体大小光是font标签就能绕地球好几圈。代码和内容混在一起改一个颜色要改几十处维护起来简直是噩梦。这就是网页“远古时代”的真实写照。二、CSS的诞生1996年一场“分离革命”2.1 CSS是什么CSS全称是Cascading Style Sheets中文叫层叠样式表。“层叠”这个听起来有点学术的名字其实想表达的意思是多个样式规则可以“层层叠加”到一起最后合并生效就像几张透明的塑料片叠在一起最终呈现出组合效果。当然你暂时可以简单把它理解为“给HTML穿衣服”——HTML负责网页的内容结构CSS负责让这些内容变得好看。1994年挪威科学家Håkon Wium Lie他也是Opera浏览器的联合创始人之一与浏览器工程师Bert Bos联手开始设计一种全新的样式语言。经过两年多的努力1996年12月17日W3C万维网联盟正式发布了CSS1规范。在CSS1中已经包含了字体相关属性、颜色与背景属性、文字属性、盒模型相关属性等基础样式控制。2.2 CSS11996年从零到一的突破CSS1带来的三大革命性变化变革说明样式与内容分离将样式代码单独写在style标签或外部.css文件中HTML只负责结构层叠机制多个样式规则可以“叠加”生效优先级明确的制度让样式控制灵活可控盒模型雏形将网页元素视为“盒子”通过控制margin、padding、border来管理布局2.3 CSS21998年定位与浮动的布局时代1998年5月CSS2正式发布。它在CSS1的基础上增加了定位positioning和浮动float两大重要特性让网页布局有了质的飞跃。同时CSS2还带来了伪类和伪元素:hover、:active、:first-letter等让交互状态有了样式媒体类型支持可以为屏幕screen、打印机print设置不同的样式绝对和相对定位position: absolute和position: relativeCSS2.12004-2007年是对CSS2的修订和纠错版本成为了此后十多年使用最广泛的CSS版本。三、CSS3的横空出世模块化的大革命3.1 为什么需要CSS3随着Web技术的飞速发展设计师对视觉表现的需求越来越强烈——圆角、阴影、渐变、动画、响应式布局……这些在CSS2时代几乎无法优雅实现往往需要依赖图片和JavaScript的“曲线救国”。而CSS2的规范本身已经变得庞大臃肿——一个超长的规范文档浏览器厂商实现起来困难重重。W3C面临一个问题是等所有功能都完善了再统一发布一个新版本还是先发布一部分让开发者先用上W3C选择了后者。这就是模块化Modularization的核心思路。3.2 模块化的本质分而治之CSS3不像CSS1或CSS2那样是一个“大而全”的单一规范文档。相反它被拆分成了几十个独立的模块modules每个模块专门负责一类功能选择器模块Selectors Level 3背景与边框模块Backgrounds Borders Level 3颜色模块Color Level 3文本效果模块Text Level 32D/3D变换模块Transforms Level 1过渡模块Transitions Level 1动画模块Animations Level 1弹性盒子模块Flexible Box Layout Level 1网格布局模块Grid Layout Level 1媒体查询模块Media Queries Level 3……还有更多模块化的好处显而易见分步推进不同模块可以按自己的节奏发展不需要等所有模块都完成才能使用独立实现浏览器可以选择优先实现某些热门模块如flex、border-radius灵活升级以后可以单独升级某个模块而不影响其他模块降低门槛开发者可以按需学习不必一次性掌握所有内容3.3 CSS3的时间线时间里程碑事件1999年CSS3开始制订2001年5月23日W3C完成CSS3工作草案2010年CSS3作为CSS 3.0标准版本正式发布2011年至今各模块逐步演进部分模块至今仍在更新中所以你会发现CSS3不是一个“已完成的成品”而是一个持续演进的生态系统。3.4 常见疑惑解答Q1CSS3为什么不一次性发布完A因为Web技术迭代太快如果等所有模块都完善了再发布新技术早就被其他方案取代了。模块化让优秀特性可以立即投入使用。Q2CSS4是什么存在吗A目前W3C还没有正式发布CSS4这个整体版本名称。CSS4的概念更多是指各个模块的“Level 4”规范例如选择器模块有Selectors Level 4媒体查询模块有Media Queries Level 4等。Q3CSS3所有模块现在都支持了吗A核心模块如选择器、背景边框、Flexbox、Grid等主流浏览器已完全支持。但一些较新的特性如conic-gradient、scroll-timeline等仍需检查 caniuse.com 上的支持情况。四、CSS3到底带来了什么总结来说CSS3为网页设计带来了革命性的五大能力提升1. 强大的选择器体系CSS3新增了属性选择器、结构伪类选择器:nth-child()、:nth-of-type()、否定伪类:not()等无需靠类名和ID就能精准选中目标元素。2. 华丽的视觉效果圆角border-radius、阴影box-shadow、text-shadow、渐变linear-gradient、radial-gradient、透明度opacity、rgba()……告别了图片时代。3. 现代化的布局方案Flexbox弹性盒子和CSS Grid网格布局彻底解放了开发者一行display: flex就能实现过去十几行代码才能完成的垂直居中。4. 鲜活的动画交互transition和animation让网页从“静态”变成“动态”加上transform的变换能力网页交互体验提升到了前所未有的高度。5. 响应式设计能力媒体查询media可以根据不同设备屏幕尺寸动态加载不同样式真正实现了“一套代码适配所有屏幕”。一句话总结如果说CSS2解决了“能不能布局”那么CSS3真正解决了“好不好看”和“灵不灵活”的问题。五、浏览器的那些“小脾气”私有前缀与兼容性5.1 什么是私有前缀有时候你会看到一些CSS代码像这样.box { -webkit-border-radius: 8px; /* Chrome, Safari, Edge */ -moz-border-radius: 8px; /* Firefox */ border-radius: 8px; /* 标准写法 */ }这些-webkit-、-moz-就是私有前缀vendor prefixes。当某个CSS3属性还是“实验性”状态时浏览器厂商会用私有前缀来测试和实现等到标准敲定、浏览器正式支持后开发者就可以只写标准版本了。浏览器内核私有前缀对应浏览器WebKit-webkit-Chrome、Safari、EdgeGecko-moz-FirefoxTrident-ms-IE已淘汰Presto-o-Opera已淘汰5.2 如何查询兼容性CSS3特性很多不同浏览器的支持情况参差不齐。推荐使用caniuse.com查询——输入属性名即可看到全球主流浏览器支持情况的色块图绿色表示支持红色表示不支持黄色表示部分支持。5.3 好消息核心CSS3特性已全面支持目前border-radius、box-shadow、flex、grid、transition、transform、animation、media等核心CSS3特性Chrome、Firefox、Edge、Safari等现代浏览器均已原生支持开发者已经不需要再手动添加大量私有前缀。但像conic-gradient锥形渐变这类较新的特性建议先查caniuse确认兼容情况。六、CSS3的核心模块一览以下是CSS3最常用、开发者必须掌握的模块分类视觉效果类边框圆角border-radius——卡片、按钮必备阴影box-shadow/text-shadow——层次感随手就来渐变linear-gradient/radial-gradient/conic-gradient透明度opacity/rgba()动画与交互类2D/3D变换transform——平移、旋转、缩放、倾斜、3D透视过渡transition——属性的平滑变化动画animation/keyframes——精细化动画控制布局类弹性盒子Flexbox——一维布局的终极利器网格布局CSS Grid——二维布局的王牌选手多列布局column-*——报纸式多栏排版样式装饰类多背景多个url()背景剪裁与原点background-clip/background-origin/background-size自定义字体font-face响应式类媒体查询media——跨设备适配的核心视口单位vw、vh、vmin、vmax七、实操初体验第一个CSS3样式让我们动手写一点代码感受CSS3的魅力。新建一个HTML文件!DOCTYPE html html langzh-CN head meta charsetUTF-8 titleCSS3 卡片效果 - 带详细注释/title style /* 卡片样式 */ .card { width: 300px; /* 固定宽度 */ padding: 20px; /* 内边距让内容不贴边 */ /* ---------- 圆角 ---------- */ /* 标准圆角属性所有现代浏览器都支持 */ border-radius: 16px; /* ---------- 背景处理 ---------- */ /* 后备背景色当浏览器不支持渐变时显示纯色兼容 IE8/9 等旧浏览器 */ background-color: #667eea; /* 带浏览器前缀的渐变兼容旧版 WebKit如 Safari 5.1-6 */ background-image: -webkit-linear-gradient(135deg, #667eea 0%, #764ba2 100%); /* 标准渐变语法支持 IE10、Chrome 26、Firefox 16 等 */ background-image: linear-gradient(135deg, #667eea 0%, #764ba2 100%); /* ---------- 盒子阴影 ---------- */ /* 参数水平偏移 垂直偏移 模糊半径 颜色 */ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2); /* ---------- 过渡动画 ---------- */ /* 让 transform 和 box-shadow 的变化平滑过渡持续 0.3 秒缓动函数 ease */ transition: transform 0.3s ease, box-shadow 0.3s ease; /* 为旧版 Safari / Chrome 添加过渡前缀可选但更保险 */ -webkit-transition: -webkit-transform 0.3s ease, box-shadow 0.3s ease; } /* 鼠标悬停时的效果 */ .card:hover { /* 放大卡片scale(1.02) 表示放大 2%视觉上微微浮起 */ transform: scale(1.02); /* 兼容旧浏览器的前缀写法 */ -webkit-transform: scale(1.02); /* 加深阴影让悬浮感更明显 */ box-shadow: 0 20px 35px rgba(0, 0, 0, 0.3); } /* 卡片标题样式 */ .card h3 { color: white; /* 白色文字 */ margin: 0 0 10px 0; /* 上右下左去除上边距下边距留 10px */ /* 文字阴影增加立体感水平2px垂直2px模糊4px半透明黑色 */ text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3); } /* 卡片正文样式 */ .card p { color: rgba(255, 255, 255, 0.9); /* 接近白色但略透明柔和 */ line-height: 1.5; /* 1.5倍行距提升阅读舒适度 */ } /style /head body !-- 一个简单的卡片容器展示 CSS3 的核心特性 -- div classcard h3✨ CSS3 初体验 ✨/h3 p圆角、渐变、阴影、过渡——只需要几行CSS3代码一个精美的卡片就诞生了br 把鼠标放上来试试放大 阴影加深/p !-- 提示如果背景没有渐变色说明浏览器太旧会显示后备的纯紫色背景 -- /div /body /html这就是CSS3的魅力——几行代码一个引人注目的视觉作品。而你过去可能需要使用图片、大量的JavaScript和复杂的定位才能勉强实现。把这段代码复制到一个.html文件中用浏览器打开然后把鼠标放在卡片上感受一下平滑的过渡效果。八、总结CSS从1996年的CSS1实现样式与内容分离到1998年的CSS2引入定位与浮动布局再到CSS3以模块化架构拆分为圆角、渐变、Flex、Grid、动画等独立模块持续演进彻底解决了早期网页样式冗余、布局困难的问题。CSS3带来了强大的选择器、华丽的视觉效果、现代化的布局方案、鲜活的动画交互以及响应式设计能力核心特性已被现代浏览器全面支持让网页从单调文档进化为精美且动态的视觉作品。如果这篇文章帮你解决了实操上的困惑别忘记点击点赞、分享也可以留言告诉我你遇到的其它问题我会尽快回复。动手练习是掌握编程最快的方法请务必亲手敲一遍本文的所有示例代码并截图保存你的成果。你的关注是我坚持原创和细节共享的力量来源谢谢大家。
