CSS BEM 命名规范简介 1 什么是 BEM 命名规范 Bem 是块(block)、元素(element)、修饰符(modifier)的简写,由 Yandex 团队提出的一种前端 CSS 命名方法论。 BEM 是一个简单又非常有用的命名约定。让你的前端代码更容易阅读和理解,更容易协作,更容易控制,更加健壮和明确,而且更加严密。 1.1 BEM 命名模式 BEM 命名约定的模式是: .block {} .block__ele 前端开发 任侠 2018-03-25 7441 热度 3评论
CSS 代码质量校验:stylelint 、stylefmt 及 post-sorting 的开发环境配置参考 在团队开发中,良好的代码规范约定是保证互相良好协作的基本要求。 stylelint 是一个强大的 CSS linter 工具,它使用 PostCSS 的 AST 语法解析树引擎,支持 PostCSS 支持的所有语法识别,而且还支持自定义语法解析器,具有很大的扩展性,对于 SCSS、LESS 和 SugarSS 都可以良好的支持。 stylefmt 是一个基于 stylelint 的代码修正工具,它 前端开发 任侠 2016-07-12 8353 热度 0评论
CSS 代码校验器 csslint: 在 sublime text 编辑器中安装和配置 csslint 本文主要介绍在 sublime text 3 编辑器中配置 csslint 的方法步骤,以帮助你快速完成相关配置,避免花费更多的时间去探索。 1. 安装 csslint 打开 cmd 命令提示符,使用 node 进行全局安装 csslint npm i eslint -g –registry=http://registry.npm.taobao.org/ –disturl=https://npm. 前端开发 任侠 2016-07-07 6219 热度 0评论
CSS3 Media Queries:媒体设备的样式适应 Media Queries直译过来就是“媒体查询”,在我们平时的Web页面中head部分常看到这样的一段代码: <link href=\"css/reset.css\" rel=\"stylesheet\" type=\"text/css\" media=\"screen\" /> <link href=\"css/style.css\" rel=\"stylesheet\" type=\"text/cs 前端开发 任侠 2013-06-01 11125 热度 4评论
CSS 伪类选择器:如何使用 CSS3 伪类 CSS3 是个好东西,但也很容易被她的变形(transform)和动画(其中许多特性因浏览器厂商而异)特性所迷惑,因而忘了那些已经被添加到标准规范中的最为基本的选择器。许多强大的新伪类选择器(最新的 W3C 规范中列出了 16 条)使得我们能够在新的标准范围内使用元素选择器。 在探讨这些新的 CSS3 伪类之前,先简要回顾追溯一下这些在 Web 应用中常常被误解的 CSS 选择器。 1. 伪类简史 前端开发 任侠 2013-05-31 28873 热度 0评论
oschina 的愚人节小创意:CSS3 的 transform 特性 早上登陆 qq 后,不时的几个关于开发的群里都贴出了 oc 的地址,打开一看,噢,CSS3 的 transform rotate特性! 查看下页面属性,即是 js 的方式对页面全局加了如下属性: -webkit-transform: rotate(-8deg); 你可以如此来写: body { -moz-transform: rotate(-8deg); -webkit-transform: ro 前端开发 任侠 2013-04-01 11121 热度 6评论
bootstrap前端开发框架简介 bootstrap:基于HTML,CSS,JAVASCRIPT的简洁灵活的流行前端框架及交互组件集。 Bootstrap是著名的社交网站、微博的先驱Twitter在2011年8月推出的开源WEB前端框架,集合CSS和HTML,使用了最新的浏览器技术,为快速WEB开发提供了一套前端工具包,包括布局、网格、表格、按钮、表单、导航、提示等等。使用Bootstrap可以构建出非常优雅的前端界 网站建设 任侠 2012-12-01 6416 热度 0评论
css3的transition特性:增强网站的体验的CSS3 Transition使用详解 这是一个传说,在两年前第一份CSS3中文手册出来没几天时,它就躺在我的电脑里了,可惜只是一直躺着,仅此而已。其实我算是个用到什么才会去学习什么的懒人,所以很多东西都只是“略懂,略懂”。 这次看到了CSS3的Transition的小绚丽,我就不淡定了,立即马上扒别人的代码查找详细资料补充营养。本站对transition属性的旋转特性作了应用,可将鼠标滑动到页面导航栏 网站建设 任侠 2011-08-30 12968 热度 7评论
CSS学习进阶:一些CSS设计的实用小技巧参考 进阶学习和练习中,一些细小的地方慢慢地变的清晰简洁起来。进步,是时间和经验的累积。 css3的圆角示例: .element { .rounded{ -moz-border-radius: 5px; /* Firefox */ -webkit-border-radius: 5px; /* Safari */ border-radius: 5px; /* future proofing */ } .e 网站建设 任侠 2010-04-23 4653 热度 0评论
玉树地震全国哀悼日,请网站设置黑白灰素装CSS代码以站长的特殊方式表达们的悼念之情 进入本站时,如果你用的是IE浏览器,你应该看到了本站已经全站素装了,是的,又一次全国的哀悼日,真的很遗憾。 去年的汶川地震还让很多人心有余悸,而今年又发生了玉树大地震,多灾多难的中国啊!去年全国哀悼了三天,而这次,国务院依然要求以全国哀悼活动的形式,悼念遇难的同胞们,对于我们来说,除了捐款捐物外,也只能以积极响应的方式,表达我们的自己内心的情感。 国务院公告:为表达全国各族人民对青海玉树地震遇难同 热点关注 任侠 2010-04-21 7922 热度 2评论