![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
易烊千玺的女朋友
这个作者很懒,什么都没留下…
展开
-
css 选择其中中 +(加号)、>(大于号) 、空格、~(波浪线)、,(逗号)的使用
加号 +:例子:p+span选择 p元素后紧接出现的span,p 和 span元素拥有共同的父元素<div> <p>这是段落</p> <span>这是行内元素文本</span></div>大于号 >例子:p>span选择 p元素下的第一级子节点span,p 是 span的父元素<div> <p>这是段落<span>这是行内元素文本...原创 2020-08-05 11:34:16 · 1390 阅读 · 0 评论 -
sass 使用规则、变量、混入、选择器、继承、判断、遍历、内置函数等等
介绍:层叠样式表语言,动态样式语言、CSS 预处理器、扩展语言;优点:减少 CSS 重复的代码,节省开发时间、完全兼容所有版本的 CSS;Sass 文件后缀为.scss;为什么使用sass:CSS 本身语法不够强大,代码重复率高,无法复用,不方便维护;Sass 引入合理的样式复用机制,增加了规则、变量、混入、选择器、继承、内置函数等等特性。浏览器并不支持 Sass 代码。需要将 Sass 代码转换为 CSS 代码。node安装:npm install -g sass,编译 ...原创 2020-07-30 17:57:09 · 1073 阅读 · 0 评论 -
css原生、sass、less变量区别及使用
一般有接触到scss,less的都知道,动态样式语言。动态样式语言的精髓就在于其有了变量,其中的诸多功能都是建立在变量之上的,目前css原生也有了变量,但是个人认为使用的局限略大命名方式:scss:$开头的即表示变量less: @开头的即表示变量原生css: --(以--开头,*代表变量名称)例子:// sass $blue: blue;.box{ color: $blue;}// less@blue: blue;.box{ color: @b..原创 2020-07-30 16:52:37 · 1143 阅读 · 0 评论 -
纯css鼠标悬停后,边框动画
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>鼠标悬停边框动画</title> <style> .main{ ...原创 2020-06-15 11:42:43 · 869 阅读 · 0 评论 -
手把手记录display: grid 网格布局
grid,网格布局,顾名思义,网格就要涉及到行和列,第一步就要搞清楚哪个是行,哪个是列。Grid 布局与 Flex 布局有一定的相似性,都可以指定容器内部多个项目的位置。但是,它们也存在重大区别。Flex 布局是轴线布局,只能指定"项目"针对轴线(横轴或者纵轴)的位置,属于一维布局。Grid 布局则是将容器划分成"行"和"列"的网格,然后指定"项目所在"的单元格,可以看作是二维布局。G...原创 2020-05-12 11:40:50 · 989 阅读 · 0 评论