CSS 学习

这是我参与更文挑战的第7天，活动详情查看： 更文挑战 属性简介 基于一个或多个 媒体查询 的结果来应用样式表的一部分。就是可以根据不同的媒体类型定义不同的样式。 当页面需要响应式布局时，@media

这是我参与更文挑战的第6天，活动详情查看： 更文挑战 在开发中经常出现要滚动的模块，原始样式会影响客户的体验。为了以后更快速开发，现在开始加深影像。 属性简介 注意 ::-webkit-scrollb

这是我参与更文挑战的第5天，活动详情查看： 更文挑战 在开发中经常会用到文本溢出省略打点，为了更好的记住它，现在开始深入了解。 单行文本显示省略号 使用white-space属性设置不换行、overf

这是我参与更文挑战的第4天，活动详情查看： 更文挑战 clip-path 属性 clip-path 属性是 clip 属性的升级版。 clip-path 属性使用裁剪方式创建元素的可显示区域。区域内的

这是我参与更文挑战的第3天，活动详情查看： 更文挑战 filter属性 filter CSS属性 将模糊或颜色偏移等图形效果应用于元素。滤镜通常用于调整图像，背景和边框的渲染。 原图 blur(px)

由作者自己定义的css属性,（比如： --main-color: black;）。 可以在整个文档中重复使用。 css变量遵循级联，会从父级继承它们的值。 可以降低维护成本，增加页面高性能，减少代码体积。 变量的声明语法是：--*，变量使用语法是：var(--*)。* 代表变量…

使用伪元素和元素的颜色差，让伪元素向我们的方向移动，实现影子效果。 使用transform属性，计算每一个块元素的位置组成一个数字。 使用transition属性给line::before和line::after设置过度动画。 通过css属性选择器，获取自定义属性的值。通过变换…

animation 属性是 animation-name，animation-duration，animation-timing-function，animation-delay，animation-iteration-count，animation-direction，ani…

perspective 属性 指定了观察者与 z = 0 平面的距离，使具有三维位置变换的元素产生透视效果。 属性 transform-style 设置元素的子元素是位于 3D 空间中还是平面中变换。 修改元素 z轴 在三维空间的位置。 rotateX()元素围绕 x轴 旋转。…

我们对方块设置了按Y轴进行旋转，看见的只是方块变小，没有按Y轴旋转。是因为现在还是处于2D视角，没有透视效果。 perspective 属性 指定了观察者与 z = 0 平面的距离，使具有三维位置变换的元素产生透视效果。 perspective 属性只影响 3D 转换元素。 透…

作用是修改元素的中心点。transform属性 的变换都是基于中心点来进行变换的，中心点修改，元素变换后的位置就会改变。 可以使用一个，两个或三个值来指定，中心点偏移量。 第一个值指定X轴偏移量，参数类型是css 长度单位、百分比 或 left, center, right, …

transition CSS 属性是 transition-property，transition-duration，transition-timing-function 和 transition-delay 的一个 简写属性 。 主要用于实现 过渡动画，过渡可以为一个元素在不…

它们是 css 中的 伪元素，作用就是在一个页面中添加一个元素，但是这个元素不会出现在DOM树中。 ::before 和 ::after 向被选中元素内的首部（尾部）添加元素。添加的内容是根据其特有的属性 content 来确认的。插入的内容默认是行内元素。 因为添加的内容不会…