应用css的能力分为俩部分:
1.css的API,重点是如何应用应用css控制页面内的元素的样式;
2.css框架,重点是如何对css进行组织;
对于第一点,只有对错没有好坏之分,对于第二点是只有好坏之分没有对错.
css框架按功能分可以:控制字体的可以放在font.css文件里,控制颜色的可以放在color.css文件里.
推荐一种个人认为比较好的css组织方法:base.css+common.css+page.css.将网站内所有样式按照职能分成三大类:base common page ,
base层,提供CSSrest功能和粒度最小的通用类,这一层会被所有页面引用,力求精简通用.base层相当于建房子时打地基和准备砖块,base层相对稳定,基本上不需要维护.
common层,提供组件级的css类,与common相关的是样式化模块,我们把叶面元素分成一小块一块功能和样式相对独立的小"模块",重用度高的模块视为组件,尽量的从页面获取组件,放在common层.在建房子的时候不同的房子需要不同的门窗,门窗的位置也不同,但是门窗这个类是相通的.
page层,上面重用度不高的组件放在page层里,page层相当于建房子时候的墙画,每间房子都不同.
为了便于维护将所有的代码放在一个page.css文件里.
page层
/*首页*/ .test{} .test2{} /*关于我们*/ .test3{} .test4{} /*联系我们*/ .test5{} .test6{}
相关推荐
html+js+css, 编写高质量代码-web前端开发修炼之道-源代码 本书的核心内容是围绕Web 前端开发的三大技术要素——HTML、CSS 和JavaScript 来深入地 探讨编写高质量的HTML 代码、CSS 代码和JavaScript 代码的方法、...
探讨编写高质量的HTML代码、CSS代码和JavaScript代码的方法、技巧、规范和最佳实践
第4章 高质量的CSS 4.1 怪异模式和DTD 4.2 如何组织CSS 4.3 推荐的base.css 4.4 模块化CSS——在CSS中引入面向对象编程思想 4.4.1 如何划分模块——单一职责 4.4.2 CSS的命名——命名空间的概念 4.4.3 挂多...
base.css base.css base.css base.css base.css base.css base.css base.css base.css base.css base.css base.css base.css base.css base.css base.css base.css base.css base.css base.css base.css base.css ...
《编写高质量代码—Web前端开发修炼之道》中的base.css文件,手打的,挺实用的,建议大家使用
Canvas绘制3D烟花动画特效,js高质量源代码,网页必加点缀! Canvas绘制3D烟花动画特效,js高质量源代码,网页必加点缀! Canvas绘制3D烟花动画特效,js高质量源代码,网页必加点缀! Canvas绘制3D烟花动画特效,js...
CSS,可以帮助把网页外观做得更加美观; JavaScript,是一种轻量级的解释型编程语言; jQuery,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互; Bootstrap 是快速开发 ...
CSS,可以帮助把网页外观做得更加美观; JavaScript,是一种轻量级的解释型编程语言; jQuery,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互; Bootstrap 是快速开发 ...
基于任务1的HTML代码,实现简单的CSS代码编写 任务三:HTML、CSS布局入门,三栏式布局的实践 任务四:HTML、CSS布局深入,定位和居中问题的实践 任务五:基于任务1的HTML代码,实现一个稍微复杂的CSS代码编写 任务六...
HTML5实现五彩烟花动画特效,canvas炫彩烟火,高质量js源代码! HTML5实现五彩烟花动画特效,canvas炫彩烟火,高质量js源代码! HTML5实现五彩烟花动画特效,canvas炫彩烟火,高质量js源代码! HTML5实现五彩烟花...
css命名规则.txt,这个虽然只有不到100行,但却非常详细,能够帮助网页设计师创建高质量css代码的标签。
本资源摘要信息涵盖了 HTML+CSS 前端编码规范的主要内容,旨在提供一个统一的编码标准,以确保前端开发的质量和可维护性。 目录 1. CSS 样式文件的命名 CSS 样式文件的命名规则非常重要,旨在确保文件名的唯一性和...
在2003年创建之初,“CSS禅意花园”还默默无闻,而现在已发展到包含将近150件设计作品的规模,这些作品来自世界各地,树立了使用CSS设计高质量网站的标准。本书将引领读者探索“CSS禅意花园”中最激动人心的36件设计...
得益于其智能工具,该软件可以自动粘贴您所需的代码,分析CSS代码并指出所有缺陷和缺陷以及正在进行的项目您将随时在不同的浏览器中获得预览。 Rapid CSS编辑器的功能: 该软件在计算机硬盘驱动器上的功耗低 ...
主要介绍了编写灵活、稳定、高质量的HTML和css代码规范指南,如何书写规范的html以及css代码,大家可以参考下文进行学习
代码质量检查器文件数代码源行重复率高复杂度率最大复杂度支持的语言js,jsx css,更少,scss入门安装代码质量检查器通过运行一个命令来检查代码质量。 支持的语言js,jsx,vue css,less,scss,sass,styl快速入门...
CSS 选择器是前端开发中不可或缺的一部分,掌握了正确的选择器方法可以提高开发效率和代码质量。下面是前端开发中经常使用的 30 个 CSS3 选择器,包括通用元素选择器、ID 选择器、类选择器、标签选择器、伪类选择器...
24款分页样式任意挑选,样式精美,流行的css架构,代码质量高,重用率高
本书的核心内容是围绕Web前端开发的三大技术要素——HTML、CSS和JavaScript来深入地探讨编写高质量的HTML代码、CSS代码和JavaScript代码的方法、技巧、规范和最佳实践,从而为编写易于维护的Web前端代码打下坚实的...