自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(13)
  • 问答 (8)
  • 收藏
  • 关注

原创 CSS实现多行文本变省略号

overflow: hidden;display: -webkit-box; /* 仅适用Chrome浏览器内核 */-webkit-line-clamp: 2; /* 需要在第n行换行 */-webkit-box-orient: vertical;word-break: break-all; /* 遇到英文也进行换行 */

2022-04-19 14:28:07 167

原创 前端常用属性、方法,可以用作工具书(持续更新中...)

以下内容均为自己平时总结,如有错误欢迎指正!目录一、普通元素通用方法二、String三、Array四、Object五、Date六、Promise七、XMLHttpRequest八、JSON九、RegExp十、节点(元素)对象十一、window对象(BOM核心)十二、事件对象event十三、单例内置对象十四、原型链十五、关键字一、普通元素通用方法parseInt(值、变量):转换为整数,有向下取整,将字符串转换为数值的功能。返回新

2022-03-04 14:26:10 648

原创 什么是LHS查询和RHS查询

目录一、概念二、例子三、练习题一、概念"L"和"R"分别代表左侧和右侧。那么是什么东西的左侧和右侧呢?是一个赋值操作的左侧和右侧。换句话说,当变量出现在赋值操作的左侧时进行LHS查询,出现在右侧时进行RHS查询。你可以理解为:LHS查询是试图找到容器背身,而RHS查询是取到该容器的源值。二、例子有以下代码:a = 2;这里对a的引用就是LHS引用,因为我们只想要为 “= 2”这个赋值找到一个目标(容器)。另外:console.log(b);这里

2022-01-03 11:00:12 1075

原创 利用正则表达式解决手机号码验证

let reg = new RegExp(/^1[3-9]\d{9}$/); // 方式一let reg = /^1[3-9]\d{9}$/; // 方式二

2021-12-23 10:43:03 526

原创 使用递归时返回结果是undefined的原因和解决办法

使用递归时返回结果是undefined的原因和解决办法

2021-12-23 10:41:18 5420 1

原创 return在forEach()中的注意点

forEach()中不能使用return,没有任何意义let arr = [10, 20, 30, 40, 50];function getItem(arr) { arr.forEach(item => { return item; });}console.log(getItem(arr)); // undefined如果想遍历一个数组拿到里面的数据,则可以使用普通for循环,它是可以正常return的let arr = [10, 20, 30,

2021-12-23 10:34:53 1052

原创 引用数据类型内的值修改后的小bug

当我们在页面的任意位置修改引用数据类型里面的值时,会发现在页面的任何位置打印,这个引用数据类型内的值都已经发生了改变

2021-11-27 11:43:53 202

原创 深入理解函数的arguments对象

一、知识点1.形参的命名并不是必须写的,它只是方便开发者用来辨别不同参数2.用function关键字定义(非箭头)函数时,可以在函数内部访问arguments对象,从中获得传进来的每个实参3.arguments对象是一个类数组对象(并非Array实例),所以访问第一个实参是arguments[0],访问第二个是arguments[1],同理可以通过arguments.length来确定传进来多少个实参function sayHi() { ...

2021-11-17 11:57:17 686

原创 align-items和align-content区别详解

目录一、子项为单行时1.1 flex盒子不设置高度时1.2 flex盒子设置高度时二、子项为多行时2.1 flex盒子没有高度时2.2 flex盒子设置高度时三、拓展四、总结一、子项为单行时1.1 flex盒子不设置高度时初始状态如下flex盒子添加align-items: center时,结果如下结果:可以看到每个每个子元素都居中显示flex盒子添加align-content: center时,结果如下结果:和初始状态没有区别..

2021-11-05 19:23:53 791

原创 关于transform的一些拓展

一、盒子transform后对周围盒子的影响代码:<style> .box1, .box2 { width: 300px; height: 300px; } .box1 { background: #000; transform: translateX(100px) translateY(100px); }..

2021-11-02 16:29:35 222

原创 父盒子包子盒子时,父子盒子之间的缝隙问题

今天在写进度条案例时发现,父盒子下的子盒子宽高都设置了100%,子盒子依旧无法填满父盒子,有个约1px的缝隙;起初以为是圆角的问题导致有缝隙,后来我直接使用矩形盒子,依旧出现了同样情况。代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"&g

2021-10-29 19:37:56 1131

原创 外边距塌陷问题导致子盒子绝对定位top属性出问题

body { position: relative;}.father { margin: 100px auto; width: 800px; height: 300px; background: #000;}.son { position: absolute; top: 100px; width: 500px; height: 100px; background: pink;}<div class="fa.

2021-10-28 22:31:37 167

原创 CSS样式建议书写顺序及原因

查阅相关资料后,整理出符合规范的书写顺序如下(1)定位属性:position display float left top right bottom overflow clear z-index(2)自身属性:width height margin padding border background(3)文字样式:font-family font-size font-style font-weight font-varient color(4)文本属性:text-align vertical

2021-10-26 21:19:50 106

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除