oocss的概念
众多开发者忽视了css的表现（认为它）
oocss将页面可重用的元素抽象成一个类，用class加以描述，而与其对应的HTML即可看成是此类的一个实例。

oocss的作用
1.加强代码复用以便方便维护。
2.减少cs体积
3.提升渲染效率
4.组件库思想，栅格布局可共用，减少选择器，方便扩展。
注意事项
1.不要直接定义子节点，应该把共性放在父类中

2.结构和皮肤相分离

3.容器与内容相分离

4.抽象出可重用的元素，建好组件库，在组件库内寻找可用的元素组装页面
5.往你想要扩展的对象本身增加class而不是他的父节点。
6.对象应保持独立性

7.避免使用ID选择器，权重太高，无法重用
8.避免位置相关的样式

9.保证选择器相同的权重
10.类名，简短，清晰，语义化，oocss的名字并不影响HTML语义化。
目前用得比较多的css:reset.css,normalize.css,neat.css
本文看自CSS在工程中改变之面向对象的 CSS视频

CSS在工程中改变之面向对象的 CSS的更多相关文章

  1. CSS：CSS 在工程中改变——面向对象的CSS （OO CSS）

    一.OO  CSS 的概念解读 (一)众多开发者忽视了CSS的表现,认为其太过简单,是一种机械的工作,而把更多关注在JS的性能或者其他方面. (二)OO CSS 将页面可重用元素抽象成一个类,用cla ...

  2. 谈谈CSS预处理技术中for循环的应用-CSS Sprite

    各种新技术的出现,推动着Web前端技术飞速发展,在提升用户体验的同时也方便开发者: 在前端优化时,我们使用CSSSprite技术,把多个图片合在一张图片上,然后通过background-image,b ...

  3. 面向对象的CSS

    原文 简书原文:https://www.jianshu.com/p/cb5e9f56ddcc 大纲 1.面向对象的CSS(OOCSS)概念 2.面向对象的CSS的作用 3.面向对象的CSS的注意事项 ...

  4. vue-cli创建的webpack工程中引用ExtractTextPlugin导致css背景图设置无效的解决方法

    当我们用vue-cli创建项目后,如果在我们的template模板文件中的css样式设置中,有设置了background-image的属性,并且url值传入的是相对路径,那么当我们在打包生产代码时,w ...

  5. 前端开发css实战：使用css制作网页中的多级菜单

    前端开发css实战:使用css制作网页中的多级菜单 在日常工作中,大家都会遇到一些显示隐藏类菜单,比如页头导航.二维码显示隐藏.文本提示等等......而这些效果都是可以使用纯css实现的(而且非常简 ...

  6. 面向对象的 CSS (OOCSS)

    原文链接:来自smashing magazine 译文 你是否听说过一个词语叫“内容就是王道”?作为一个 Web 开发者,我们的工作与内容创作有着频繁的联系.这是一条经常被引用,并且正确地解释了什么因 ...

  7. 解决MVC中使用BundleConfig.RegisterBundles引用Css及js文件发布后丢失的问题

    ASP.NET MVC4,ASP.NET MVC5中对JS和CSS的引用又做了一次变化,在MVC3中我们这样引用资源文件: <link href="@Url.Content(" ...

  8. web工程中URL地址的推荐写法

    三.web工程中URL地址的推荐写法 使用c标签<c:url value="" /> 会自动添加项目名 -> value中的值 前面要加 “/” 在JavaWeb ...

  9. 关于eclipse中MAVEN WEB工程中编译问题

    这几天是被java的环境搞疯了,我先是搭了一个spring+springmvc+mybatis的工程,在家里跑了一下,没有问题,把工程带到公司里用,却一直不能使用. 按常理来说,只要工程发生一点变化, ...

随机推荐

  1. C++ 操作json文件

    一.环境搭建: 参考文章:https://blog.csdn.net/fakine/article/details/79272090 二.创建实例: #include <stdio.h> ...

  2. 记一次批量修改SQLServer表数据

    前提: 1.数据有上百万条,分成10几张excel表,从数据库中导出,由业务部门修改: 2.数据没什么规律: 3.和数据库DB商量后决定先把从excel导进数据库中,再通过关联查询修改数据 将 Exc ...

  3. 34-Ubuntu-用户权限-05-超级用户

    超级用户 Linux系统中的root(超级用户)账号通常用于系统的维护和管理,对操作系统的所有资源具有访问的权限. 在大多数的Linux版本中,都不推荐直接使用root账号登录系统. 在Linux安装 ...

  4. 第八篇 编写spider爬取jobbole的所有文章

    通过scrapy的Request和parse,我们能很容易的爬取所有列表页的文章信息. PS:parse.urljoin(response.url,post_url)的方法有个好处,如果post_ur ...

  5. 【洛谷】P1349广义斐波那契

    题目链接:https://www.luogu.org/problemnew/show/P1349 题意:现在定义fib数列为 an = p * an-1 + q * an-2求第n项%m的答案. 题解 ...

  6. ArcGis EsriAddin加载项的安装路径与程序启动路径

      安装路径: 在C:\Users\用户名\Documents\ArcGIS\AddIns\Desktop版本号\{…………一组GUID…………}这样的路径下.  例:C:\Users\Adminis ...

  7. 本地调试H5页面

    摘要 详细讲述微信H5页面调试(安装在安卓或iOS手机上的),钉钉内H5页面的调试,QQ.微博以及各浏览器上H5页面的调试方法 背景 大学毕业快要一年了,用leader的话说我也是有一年开发经验的前端 ...

  8. vue中ref的使用（this.$refs获取为undefined）

    如果你获取到的总是空的,你注意一下: 1.你在哪里调用,和你调用的对象 试试在mounted()里面调用有效果没有 调用的对象是本来就存在的,还是需要数据渲染之后才会出现的,同理,在mounted() ...

  9. Pregel Worker

  10. struts2类型转换1

    概述 从一个 HTML 表单到一个 Action 对象, 类型转换是从字符串到非字符串. HTTP 没有 “类型” 的概念. 每一项表单输入只可能是一个字符串或一个字符串数组. 在服务器端, 必须把 ...