首页 web前端 css教程 使用CSS框架布局的缺点和优点小结_经验交流

使用CSS框架布局的缺点和优点小结_经验交流

May 16, 2016 pm 12:06 PM

现在好多网站都用了p+css来布局网页结构,优点是速度快了,可负面影响呢,来看下面的分析
前端时间写了一篇《利用CSS框架进行高效率的站点开发》,有不少朋友问我相关的问题。很早5key就在公司进行CSS框架的架构,也对不少朋友提出CSS框架的建议。效果是很明显的。当然,CSS框架有利也有弊,最近也看了一些相关的文章。一些感想,与大家分享。 

CSS框架之利: 
1、开发效率的提高。 
        如果你是一个企业建站的前端开发,相信在大部分时间里进行着同类站点的代码工作。定义好的框架可以大大提高你的工作效率,避免一些常见的错误。如果你的工作是按件计费的,你的报酬一定会比别人多。 

2、规范代码命名。 
       在多个站点中你可能会用到一些同样的CLASS或ID。如果你有一套完善的css框架,很快你就能对你的每一个站点的代码进行通读。不用浪费时间在代码的阅读上。 

3、更好的团队合作 
        有些公司会将一些稍大的站点的前端代码分成若干子项目。有过此类经验的朋友应该对这种开发方式深感郁闷,要注意公用 css,还有注意相互之间的代码配合。久而久之,废弃代码越来越多,互相之间也难以阅读。如果建立好合适的CSS框架,大家可以减少很多不必要的错误,提升产品质量和工作效率。 

4、解决浏览器的兼容性问题 
        现在大部分项目都要求兼容IE6,7和FF。每个站点可能都会花上一部分时间去处理兼容问题。在框架层面上就将这个问题处理好。就可以为后面的兼容问题节省下大部分时间。 

5、一套完整的、结构清晰的结构代码。 
       CSS框架为你的项目提供一个干净、严谨的基础架构。通过它你可以快速的为你的站点搭建基础的html代码框架。万事开头难,前面的基础工作做好了。后面的开发速度会提高很多。 

CSS框架之弊: 
1、你需要完全的理解整套框架 
每一个加入项目的人,都需要花一定的时间去完全的理解整套框架及编码规范; 

2、你会延续一些框架中的错误bug 
没人可以保证自己制定的框架是完美而没有bug的。你可能会需要时间去清理框架中的bug; 

3、限制开发思路 
框架给出大家基本的架构及开发的思路,这可能会限制你对产品开发的新思路; 

4、臃肿的源代码 
框架中可能有很大一部分代码不会经常用到,而且还会降低执行效率; 

5、框架的语义化 
我们已经注意到了HTML代码的语义化。但基于框架的每个站点都是独立唯一的,我们很难去保证CSS框架的语义化。

以上就是使用CSS框架布局的缺点和优点小结_经验交流的内容,更多相关内容请关注PHP中文网(www.php.cn)!


本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

vue配合什么css框架 vue配合什么css框架 Dec 26, 2023 pm 01:48 PM

与Vue兼容的常见CSS框架有“BootstrapVue”、“Element UI”、“Vuetify”、“Buefy”四种,上述框架都是开源的,拥有庞大的社区支持,它们提供了丰富的UI组件、灵活的布局选项和易于定制的主题,使得开发人员可以快速构建美观、功能齐全的Web应用程序。

WordPress网页错位现象解决攻略 WordPress网页错位现象解决攻略 Mar 05, 2024 pm 01:12 PM

WordPress网页错位现象解决攻略在WordPress网站开发中,有时候我们会遇到网页元素错位的情况,这可能是由于不同设备上的屏幕尺寸、浏览器兼容性或者CSS样式设置不当所致。要解决这种错位现象,我们需要仔细分析问题、查找可能的原因,并逐步进行调试和修复。本文将分享一些常见的WordPress网页错位问题以及相应的解决攻略,同时提供具体的代码示例,帮助开

推荐五个卓越的CSS框架,让你在前端开发中事半功倍 推荐五个卓越的CSS框架,让你在前端开发中事半功倍 Jan 16, 2024 am 09:46 AM

随着互联网的高速发展,前端开发已经成为了一个不可忽视的重要领域。作为前端开发人员,我们需要不断提升自己的开发效率和水平。而使用优秀的CSS框架是提高前端开发效率的一种有效途径。本文将为大家介绍五个优秀的CSS框架,希望能对大家的前端开发工作有所帮助。BootstrapBootstrap是目前最受欢迎的CSS框架之一。它提供了丰富的CSS类和JavaScrip

H5中position属性的灵活运用技巧 H5中position属性的灵活运用技巧 Dec 27, 2023 pm 01:05 PM

H5中如何灵活运用position属性在H5开发中,经常会涉及到元素的定位和布局问题。这时候,CSS的position属性就会发挥作用。position属性可以控制元素在页面中的定位方式,包括相对定位(relative)、绝对定位(absolute)、固定定位(fixed)和粘附定位(sticky)。本文将详细介绍在H5开发中如何灵活运用position属性

介绍win7里的窗口排列方式 介绍win7里的窗口排列方式 Dec 26, 2023 pm 04:37 PM

当我们同时打开多个窗口时,win7具有将多个窗口以不同方式排列然后同时显示的功能,能够让我们更加清晰地查看到每一个窗口的内容。那么win7窗口排列方式有几种呢,他们分别都是什么样的呢,下面就跟着小编一起来看一下吧。win7窗口排列方式有几种答:三种,分别是层叠窗口、堆叠显示窗口和并排显示窗口。当我们打开多个窗口时,可以右键点击任务栏空白处。就可以看到三种窗口排列方式了。一、层叠窗口:二、堆叠显示窗口:三、并排显示窗口:

CSS中contain的语法使用场景 CSS中contain的语法使用场景 Feb 21, 2024 pm 02:00 PM

CSS中contain的语法使用场景在CSS中,contain是一个有用的属性,用于指定元素的内容是否独立于其外部样式和布局。它可以帮助开发者更好地控制页面布局和优化性能。本文将介绍contain属性的语法使用场景,并提供具体的代码示例。contain属性的语法如下:contain:layout|paint|size|style|'none'|'stric

css框架和组件库有什么区别 css框架和组件库有什么区别 Dec 26, 2023 pm 05:03 PM

CSS框架和组件库是两个不同的概念,但它们之间有一定的关联:1、CSS框架是一种提供了一整套样式、布局和组件的工具,而组件库则是针对某个特定的组件或模块进行设计和开发的库;2、​CSS框架用于快速构建网页和应用程序,而组件库提供了一系列可复用的UI组件;3、框架通常包含了一系列预定义的CSS类和样式,而组件库中的每个组件都具有独立的样式和行为。

Windows 11 不断添加键盘布局:4 种经过测试的解决方案 Windows 11 不断添加键盘布局:4 种经过测试的解决方案 Dec 14, 2023 pm 05:49 PM

对于某些用户来说,Windows11会不断添加新的键盘布局,即使他们没有接受或确认更改。WindowsReport软件团队复制了此问题,并且知道如何防止Windows11在您的PC上添加新的键盘布局。为什么Windows11要自行添加键盘布局?这通常发生在使用非母语和键盘组合时。例如,如果您使用的是美国显示语言和法语键盘布局,Windows11可能还会添加英语键盘。如果Windows11添加了您不想要的新键盘布局,该怎么办。如何防止Windows11添加键盘布局?1.删除不需要的键盘布局单击“开

See all articles