随笔 - 143  文章 - 0  评论 - 23  阅读 - 125万

CSS3 VS CSS2大PK

本文作者通过制作同样的页面对CSS2和CSS3进行了比较,我们来看一下谁更胜一筹。
CSS3已经面世很久,目前仍处于开发完善阶段。不过网上关于CSS3的介绍、使用方法和夸奖已经传得沸沸扬扬了,建站学也有少关于CSS3的介绍。CSS3比CSS2到底是不是真的好?到底有什么优越之处呢?
本文借鉴国外作者的文章(原文可以查看文章底部链接),从CSS3编写及作用原理以外的角度分析一下CSS3与CSS的差别。
笔者利用自己制作的一个页面为例,分别使用CSS和CSS3?两个版本制作了相同的页面,使这两个页面效果几乎相同,然后对这两个CSS文件进行比较。

 


制作时间
首先,笔者在制作时间上进行对比,利用CSS3制作页面远比使用CSS节省时间。因为CSS3可以直接制作很多效果用来替换图片,而使用旧CSS版本制作的页面需要制作一些图片来体现效果,所以在制作图片上也要花费很多时间。


文件数量、容量及加载时间
其次,作者从文件的大小和加载时间方面进行了比较,如上图图一中所示。
CSS3版本的CSS文件大小为5.2K,网页文件总数为12,总容量为767.9K;CSS版本的CSS文件为4.5K,但网页文件总数为22,网页容量为849.2K。加载时间分别是3.3秒和4.7秒。
从以上数据可见,CSS3比CSS精简很多,速度也更快。


服务器请求次数
另外一个衡量指标是服务器请求次数,一般网页中有多少文件,就会对服务器有多少次请求数。不要小看这个指标,很多网页制作高手为了减少对服务器的请求负载,才探索出CSS Sprite技术。
如上图中图二所示,CSS3中一共有12个文件,CSS版本中有22个文件,所以它们对服务器的请求数分别为12和22。又是CSS3胜出。
最后,综合以上的数据,在图三中已经列出CSS3和CSS的相关数据,CSS3完胜。
这下我们可以看到CSS3除了比较美观的效果外,还有更多的优点,毕竟它是网络技术发展中的产物,必然会向更加简单实用美观的方向发展。

posted on   cbwcwy  阅读(749)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
阅读排行:
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· winform 绘制太阳,地球,月球 运作规律
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 上周热点回顾(3.3-3.9)
· 超详细:普通电脑也行Windows部署deepseek R1训练数据并当服务器共享给他人
< 2012年8月 >
29 30 31 1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31 1
2 3 4 5 6 7 8

点击右上角即可分享
微信分享提示