![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS
文章平均质量分 94
想成为大佬的鸭子
这个作者很懒,什么都没留下…
展开
-
CSS中pointer-events的应用
分享一个最近新发现的CSS3新属性——pointer-events,使用简单,并且个人觉得应该还是能在很多时候派上用场的。(如果兼容性不至于太差的话哈哈哈)pointer-events属性值先来看它的属性值,pointer-events有两个属性值值得我注意(毕竟对于我这个菜鸟来说,其他SVG专用的属性我还尚未能看懂啊唉):auto——效果和没有定义pointer-events属性相同...原创 2019-11-29 15:07:26 · 436 阅读 · 0 评论 -
css属性中使用数学计算——calc()函数
首先要说明一下,这篇博客关于calc的相关知识,大多数来自于这位前辈的博客:https://blog.csdn.net/wjnf012/article/details/80227644为了能让我自己看得更顺心,我稍作修改。作为一名初出茅庐的前端实习生,在工作中...原创 2020-08-24 14:13:08 · 1453 阅读 · 0 评论 -
CSS(3)学习笔记——持续更新
1 选择器CSS(3)中提供的选择器手册(w3school):http://www.w3school.com.cn/cssref/css_selectors.asp1.1 基本选择器选择器例子类选择器.class标签选择器elementid选择器#id后代选择器element_1 element_2:选择 element_1 内部的全部 elem...原创 2019-11-04 14:15:48 · 603 阅读 · 0 评论 -
CSS中居中的方法
行内元素、块级元素、行内块元素在说明几种居中方法之前,我先明确一下行内元素(inline)、块级元素(block)、行内块元素(inline-block)的区别和联系。 行内元素 块级元素 行内块元素 放置方式 与其他行内元素位于同一行 每个块元素独占一行(除非用一些方法来脱离文档流,如浮动 float 或定位) 与其他行内元素或行内块元素位...原创 2019-10-08 15:41:01 · 230 阅读 · 0 评论 -
CSS清除浮动的4种方法
浮动在开发中非常常用,用来使浮动元素脱离文档流进行左浮或者右浮,直到碰到父级元素或者其他的浮动元素。但是浮动也会产生一些问题,会对前后的标签产生影响,如我们想实现下面的效果:代码如下:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title><...原创 2019-07-31 16:10:39 · 119 阅读 · 0 评论 -
CSS3学习笔记(6)——动画 animation、animate.css 动画库的使用
在前几篇博客中,我记录了CSS3中“过渡”的用法,但严格上过渡并不算是真正意义上自由的动画,因为它只是初始状态过渡到了最终状态的一个过程。可以理解为只有两个节点。CSS3的 animation 样式提供了关键帧动画,通过关键字 @keyframes 配合 animation 可以设置多个节点(可理解为帧数)来精确控制一个或一组动画,常用来实现复杂的动画效果。animation:anim...原创 2019-07-25 10:32:31 · 716 阅读 · 0 评论 -
CSS3学习笔记(5)——transform 的3d变换
在CSS3中,我们可以用一个三维坐标系来表示一个3d空间:其中,z轴指向的是屏幕向外。要实现3d的移动、缩放、旋转,也需要用到 transform样式。三维移动transform: translate3d(x, y, z);其中x、y、z分别表示x、y、z方向上的偏移像素值。也可以分开写:translateX(x)、translateY(y)、translateZ...原创 2019-07-24 21:39:03 · 689 阅读 · 0 评论 -
CSS3学习笔记(4)——过渡、transform的2D变换
过渡过渡样式:transitiontransition-property 添加过渡效果的样式属性名称 transition-duration 过渡效果的耗时,以秒(s)作为单位 transition-timing-function 过渡时间函数,控制过渡的速度,匀速是linear transition-delay 过渡效果的延迟,...原创 2019-07-23 22:21:40 · 242 阅读 · 0 评论 -
CSS3学习笔记(3)——渐变、background 的使用、边框图片
渐变由于渐变效果不是单一的颜色,而是图像,因此应该写在 background 中。如background: linear-gradient(to right,red 0%,blue 100%);线性渐变线性渐变可以理解为就是沿着一条线去做颜色的渐变。语法:linear-gradient(方向, 颜色1 位置百分比, 颜色2 位置百分比, 颜色3 位置百分比...)说明:...原创 2019-07-23 14:56:17 · 293 阅读 · 0 评论 -
CSS3学习笔记(2)——颜色、文本阴影、盒模型
颜色设置HTML5中提供了两种颜色设置:1.RGBA:R:红色值,0~255之间,rgb(255,0,0) 代表纯红色;G:绿色值,0~255之间,rgb(0,255,0) 代表纯绿色;B:蓝色值,0~255之间,rgb(255,0,0) 代表纯蓝色;A:Alpha,透明度,0~1之间,不可为负数。2. HSLA:H:Hue,色调、色相。取值为0~360,过渡...原创 2019-07-22 14:49:56 · 234 阅读 · 0 评论 -
CSS3学习笔记(1)——CSS选择器、属性选择器、伪类选择器
CSS(3)中提供的选择器有很多(如下表格),下表来自w3school,我这里引用一下(新手写作,若侵权必删),原网址如下:http://www.w3school.com.cn/cssref/css_selectors.asp选择器 例子 例子描述 CSS .class .intro 选择 class="intro" 的所有元素。 1 #id ...原创 2019-07-21 11:52:58 · 390 阅读 · 0 评论