前端

为什么要用sass来写css--一个demo小实例

我在很早之前就知道世上有sass,less这些css的预处理器,可以根据他们特有的语法来编写生成css。但我始终找不到理由为什么要去学习和使用这些东西。一是不想跳出自己的舒适区,觉得css已经够用了。二来是不知道他们怎么用。我想在这篇文章里试图说服你,为什么我们要使用这些css的预处理器。 我在本文举两个sass例子,sass很简单。如果你学习过css和编程,看一下马上就能理解。如果你对sass还不熟悉,我建议你去看这两篇文章。 SASS用法指南 最详细的 Sass 基础教程指南 使用sass来实现移动适配 如果你看过我上一篇文章,你会发现,我已经在那边有提及sass。也是我了解适配移动方案使用sass可以复用大量的适配css代码,我才开始使用学习和使用sass。 //定义个mixin 根据不同dpr将px值转化成相应dpr的px值 /* @params $name 是css属性 比如 width、top

css

少用的CSS伪元素

什么是伪元素 伪元素表示为某个元素的子元素。这个子元素虽然在逻辑上存在,但却并不实际存在于文档树中。因为伪元素并不在文档树中,所以通过JS,也抓取不到伪元素,也不能给它绑事件。 ::first-line:可以给第一行定义样式 (浏览器会随着放大或缩小来换行) ::first-letter:可以给的第一个字母定义样式 (以英文來看是第一个字母;中文就是第一个中文字) ::before:可以在元素之前插入样式/內容 ::after:可以在元素之后插入样式/內容 什么时候用伪元素 HTML 标签的目的,就是为了展示内容信息。非内容信息要使用伪元素。所谓的非内容信息,指的是一些对内容进行修饰的信息。例如登录的说明等,当然还有许多更加酷炫的效果。 伪元素的具体使用 1.清除浮动