CSS
落日伏羲
这个作者很懒,什么都没留下…
展开
-
关于better-scroll的初步体验
better-scrollbetter-scroll 是一款重点解决移动端(现在也支持 PC)各种滚动场景需求的插件。better-scroll 是基于原生 JS 实现的,不依赖任何框架简单使用better-scroll 是作用在外层 content 容器上的,滚动的部分是 ul 里的元素注意better-scroll 只处理容器(content)的第一个子元素 ul 的滚动,其他元素不能处理<!DOCTYPE html><html lang="en"><he原创 2021-03-26 18:08:49 · 159 阅读 · 0 评论 -
关于弹性布局的主轴
主轴的基准尺寸定义主轴基准尺寸,优先级比width和height大 依据的是当前哪个为主轴如果flex-direction: row; 即主轴为水平,表示flex-basis 为width<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <原创 2021-03-24 23:40:04 · 322 阅读 · 0 评论 -
元素动态缩小的处理
flex-shrink: 属性这里我们在一个article中放入三个divarticle的宽度400px,每个div宽度200px所以这个父级盒子一排装不下这三个div那么我们使用一下flex-shrink属性,进行动态缩小 缩小比例计算 三个div一共600,父元素宽400,所以有200px要缩小 200/(每个元素的宽度*缩小比例) = 一个缩小比例 一个缩小比例 * 缩小的倍数 = 要缩小的数值 例如第三个div 200 / (200*1 + 200*3) * 3 =原创 2021-03-24 23:27:40 · 210 阅读 · 0 评论 -
元素显示的多种样式
关于伪类与伪元素一.伪元素(使用双冒号 :: )主要用来创建一些不存在在原dom结构树中的元素,例如使用 ::before和 ::after在一些已经存在dom结构树中的元素添加文字样式等。这些添加的内容会以具体的UI现实出来,被用户所看待,但是这些内容不会改变文档的内容,不会出现在dom中,不可赋值,仅在CSS渲染层加入。二、伪类(通常使用 : )表示已经存在的某个元素处于某种状态,但是通过dom树又无法表示这种状态,就可以通过伪类来为其添加样式。例如a元素的 :hover、:active等。&原创 2021-03-24 23:01:59 · 159 阅读 · 0 评论 -
CSS入门---初识弹性布局
CSS入门—弹性布局此节内容包括: 1. 改变弹性元素方向 2. 控制弹性元素溢出的换行处理一、首先声明一个弹性盒模型<!DOCTYPE html><html lang="en"><head>`在这里插入代码片` <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" co原创 2021-03-11 18:28:18 · 482 阅读 · 0 评论