#前端
chenyuXYT
山本无忧因雪白头,水本无愁因风起皱。
展开
-
函数珂里化的简单介绍
函数珂里化指的是将一个接受多个参数的函数 变为 接受一个参数返回一个函数的固定形式,这样便于再次调用,例如f(1)(2)经典面试题:实现add(1)(2)(3)(4)=10; 、 add(1)(1,2,3)(2)=9;function add() { const _args = [...arguments]; function fn() { _args.push(...arguments); return fn; } fn.toString = function() {原创 2020-12-09 11:14:40 · 155 阅读 · 0 评论 -
教你3分钟看懂防抖和节流
一.debounce(防抖)触发高频时间后n秒内函数只会执行一次,如果n秒内高频时间再次触发,则重新计算时间。const debounce = (fn, time) => { let timeout = null; return function() { clearTimeout(timeout) timeout = setTimeout(() => { fn.apply(this, arguments); }, time); }};防抖原创 2020-12-09 11:11:29 · 112 阅读 · 0 评论 -
HTML5中的常用语义元素汇总
在之前的工作中一直习惯使用div进行布局,之所以不使用HTML5中的语义元素主要是因为对它们的了解不多,不知道都有哪些语义元素,今天特意做了HTML5中的常用语义元素汇总,以便加深印象。HTML5 中的语义元素下面列出了以字母顺序排列的 HTML5 新语义元素。标签 描述 <article> 定义文章。 <aside> 定义页面内容以外的内容。 <details> 定义用户能够查看或隐藏的额外细节。 <figc..原创 2020-11-23 14:24:44 · 518 阅读 · 0 评论 -
网址(URL)的详细解析
HTML 统一资源定位器URL 也被称为网址。URL 可以由单词组成,比如 “w3school.com.cn”,或者是因特网协议(IP)地址:192.168.1.253。大多数人在网上冲浪时,会键入网址的域名,因为名称比数字容易记忆。URL - Uniform Resource Locator当您点击 HTML 页面中的某个链接时,对应的 <a> 标签指向万维网上的一个地址。统一资源定位器(URL)用于定位万维网上的文档(或其他数据)。网址,比如http://www.w.原创 2020-11-20 16:41:29 · 6208 阅读 · 0 评论 -
HTML 中有用的字符实体
HTML 中有用的字符实体注释:实体名称对大小写敏感!显示结果 描述 实体名称 实体编号 空格   < 小于号 < < > 大于号 > > & 和号 & & " 引号 " " ' .转载 2020-11-20 16:18:14 · 68 阅读 · 0 评论 -
关于前端性能优化的思路整理
文章目录背景思路一:从日常接触到的前端性能场景出发1、开发构建阶段(常见问题:如何让Webpack打包更快)2、资源加载阶段3、页面渲染阶段4、操作体验阶段思路二:从生活角度聊前端性能总结背景闲来无事,在刷知乎时看到《当聊起前端性能优化我们要聊什么》这篇文章,个人觉得该文章把前端性能优化的思路总结的相当清晰。文章地址:当聊起前端性能优化我们要聊什么 - 饥人谷若愚的文章 - 知乎https://zhuanlan.zhihu.com/p/263467359该文章把前端性能优化分为了两大思路:思路转载 2020-11-18 17:38:03 · 337 阅读 · 0 评论 -
node-sass安装失败的处理方法
当使用npm安装sass失败时我们可以进行如下配置npm config set sass_binary_site https://npm.taobao.org/mirrors/node-sass/执行此命令后再次执行sass安装命令即可原创 2020-09-23 10:43:15 · 64 阅读 · 0 评论 -
GRID布局(网格布局)的属性和属性值的用法介绍
文章目录GRID布局grid布局预热GRID属性容器属性:添加在容器元素项目属性:添加在子元素上面GRID布局它将网页划分成一个个网格,可以任意组合不同的网格,做出各种各样的布局Grid 布局与 Flex 布局有一定的相似性,都可以指定容器内部多个项目的位置。但是,它们也存在重大区别。Flex 布局是轴线布局,只能指定"项目"针对轴线的位置,可以看作是一维布局。Grid 布局则是将容器...原创 2020-04-16 23:35:28 · 1813 阅读 · 0 评论 -
css3媒体查询详细介绍和移动端项目准备工作前端小白必备哦!!!
文章目录媒体查询语法设备类型(默认值为all)关键字常见适配范围移动端项目准备工作meta标签的设置重点设置分辨率,PPi,DPI,DPR,物理像素,逻辑像素区别常见单位媒体查询媒体查询可以让我们根据设备显示器的特性(如视口宽度、屏幕比例、设备方向:横向或纵向)为其设定CSS样式,媒体查询由媒体类型和一个或多个检测媒体特性的条件表达式组成。媒体查询中可用于检测的媒体特性有 width 、 he...原创 2020-04-15 23:13:01 · 286 阅读 · 0 评论 -
怪异盒模型及弹性盒子详细介绍
文章目录怪异盒模型FLEX布局flex容器属性flex项目属性怪异盒模型box-sizingcontent-box 这是由 CSS2.1 规定的宽度高度行为。宽度和高度分别应用到元素的内容框。在宽度和高度之外绘制元素的内边距和边框。border-box 为元素设定的宽度和高度决定了元素的边框盒。就是说,为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。通过从已设...原创 2020-04-15 22:50:56 · 324 阅读 · 0 评论 -
css3文本属性、背景属性、颜色模式、图片边框、圆角、盒子阴影、width属性值以及calc方法详解
文章目录CSS3属性文本阴影属性文本换行@font-face背景属性颜色模式图片边框CSS圆角盒子阴影width的属性值css3 calc()方法详解pointer-events:CSS3属性文本阴影属性text-shadow说明:水平、垂直阴影的位置允许负值可进行多阴影设置(逗号分隔的方式)文本换行Word-wrap属性用来标明是否允许浏览器在单词内进行断句,这是为了防止...原创 2020-04-13 23:09:39 · 540 阅读 · 0 评论 -
css动画所包含的属性详细介绍
文章目录css3动画关键帧的定义animation vs transitionanimation简写css3动画通过 CSS3,我们能够创建动画,这可以在许多网页中取代动画图片、Flash 动画以及 JavaScript。关键帧的定义不同于过渡动画只能定义首尾两个状态,关键帧动画可以定义多个状态,或者用关键帧的话来说,过渡动画只能定义第一帧和最后一帧这两个关键帧,而关键帧动画则可以定...原创 2020-04-08 22:14:51 · 407 阅读 · 0 评论 -
css变形属性和2D功能函数的详细介绍
文章目录变形属性:transform2D2D功能函数2D位移 translate()2D缩放scale()3、rotate()4、skew()变形原点变形属性:transformtransform翻译成汉语具有"变换"或者"改变"的意思。通过此属性具有非常强大的功能,比如可以实现元素的位移、拉伸或者旋转等效果最能体现transform 属性强大实力的是实现元素的3D变换效果。2D2D...原创 2020-04-07 23:17:22 · 242 阅读 · 0 评论 -
css3渐变属性的简单介绍及应用
文章目录浏览器前缀css3 渐变线性渐变径向渐变重复性渐变浏览器前缀-ms- -ms-box-shadow IE浏览器专属的CSS属性需添加-ms-前缀-moz- -moz-box-shadow 所有基于Gecko引擎的浏览器(如Firefox)专属的CSS属性需添加-moz-前缀-o- -o-box-shadow Opera浏览器专属的CSS属性需添加-o-前缀...原创 2020-04-07 22:59:04 · 349 阅读 · 0 评论 -
css宽高自适应及高度塌陷解决方法
文章目录宽高自适应宽度自适应高度自适应最小高度的自适应浮动元素父元素高度自适应(高度塌陷)高度塌陷的解决方法visibility:hidden/隐藏伪对象选择符宽高自适应 网页布局中经常要定义元素的宽和高。但很多时候我们希望元素的大小能够根据窗口或子元素自动调整,这就是pc自适应。自适应的优点: 元素自适应在网页布局中非常重要,它能够使网页显示更灵活,可以适应在不同设备、不同窗口和不同分辨...原创 2020-04-03 22:14:19 · 346 阅读 · 0 评论 -
CSS定位和元素在浏览器窗口居中的方法以及锚点介绍
文章目录CSS文档流POSTIONposition属性值绝对定位和相对定位的区别包含块定位元素层次关系元素在浏览器窗口居中的方法锚点CSS文档流CSS 有三种基本的定位机制:普通流、浮动流、定位流。POSTIONposition定位属性,检索或设置对象的定位方式position属性值static默认值。位置设置为 static 的元素会正常显示,它始终会处于文档流给予...原创 2020-03-31 22:32:47 · 826 阅读 · 0 评论 -
解析图片内联元素img为什么能直接添加大小
img当作行内块使用,是特殊的存在,其拥有行内块元素的特点。默认情况下img元素的display属性值为inline。内联元素元素的特点之一就是不可一直接添加高宽,大小是由内容撑开的。那么内联元素img为什么能直接添加大小呢?关于img元素为何能直接添加大小的问题我们要从另一个角度对标签进行分类。分为:置换元素和非置换元素非置换元素:不是置换元素的元素都是非置换元素置换元素:...原创 2020-03-27 19:50:40 · 233 阅读 · 0 评论 -
CSS元素类型及元素类型特点的介绍
文章目录元素类型块状元素的特点内联元素的特点可变元素常见的标签块内联元素类型的转换display属性display的属性值补充元素类型根据css显示分类,XHTML元素被分为三种类型: 块状元素,内联元素,可变元素三种类型: 块状元素,内联元素,内联块元素(css2.1增加)块状元素的特点A.块状元素在网页中就是以块的形式显示,所谓块状就是元素显示为矩形区域,B.默认情况...原创 2020-03-26 23:31:07 · 374 阅读 · 0 评论 -
网页新闻列表编写流程和文本溢出变省略号设置
文章目录一.新闻列表的编写流程二.文本溢出overflowwhite-spacetext-overflow三.文本溢出变省略号设置一.新闻列表的编写流程1.结构:如果后面有时间:<li> <a href="#">新闻条</a> <span>2020-03-25</span></li>如果没有时间:<li...原创 2020-03-25 19:39:08 · 265 阅读 · 0 评论 -
margin介绍及网页规划思路
MARGINmargin用法 (外边距、边界)1:margin在元素外围,不会撑大元素的大小2:作用:控制元素与元素之间的间距。3:给单一方向添加marginmargin-left/right/top/bottom4 :margin设置方法:margin:30px; 四周margin:10px 30px; ...原创 2020-03-24 20:23:44 · 787 阅读 · 0 评论 -
css盒模型及padding介绍
盒模型盒模型是css布局的基石,它规定了网页元素如何显示以及元素间相互关系。css定义所有的元素都可以拥有像盒子一样的外形和平面空间。即都包含内容区、补白(填充)、边框、边界(外边距)这就是盒模型。...原创 2020-03-24 13:50:38 · 268 阅读 · 1 评论 -
css属性
文章目录CSS属性文本属性1:文本大小 font-size2:文本颜色 color3:文本类型 font-family:字体1,字体2,字体3......4:文字加粗font-weight:bolder(更粗的)/bold(加粗)/normal(常规)/100—900;5:font-style:italic/oblique/normal(取消倾斜,常规显示);6:文字行高 {line-heig...原创 2020-03-20 20:46:22 · 141 阅读 · 0 评论 -
css基础
文章目录cssHTML + CSSCSS语法CSS样式表1:内部样式表2:外部样式link @import区别3:内联样式表CSS样式表的权重关系CSS选择符类型选择符类(class)选择符ID选择符伪类选择器通配符群组选择符包含选择器(后代选择器)选择符权重css层叠性cssCSS(cascading style sheet) 汉译为层叠样式表,是用于控制网页样式WEB标准中的表...原创 2020-03-18 21:00:10 · 263 阅读 · 0 评论 -
html表格和表单简介
文章目录表格1.表格的作用2.HTML表格样式:3.表格内元素介绍4.表格标签里面的属性值5.单元格之间的合并表单1 : 表单标签2 : 表单控件拓展:post/get表格1.表格的作用表格的作用:显示数据2.HTML表格样式:3.表格内元素介绍表格的HTML标签是tabletr和td是table里面的子元素tr表示一行td表示单元格4.表格标签里面的属性值border...原创 2020-03-18 20:56:56 · 458 阅读 · 0 评论 -
HTML的基本结构和常用标签
文章目录1.HTML的基本结构和语法2.HTML常用标签及标签内的常用属性属性1.HTML的基本结构和语法html语法说明:a.在尖角符号里面的第一个单词就是标签名称b.在标签后面用空格隔开的是属性c.属性和属性值之间用等号连接d.属性值放在引号里面(单双引号都可以)e.一个标签可以有多个属性,属性与属性之间用空格隔开HTML基本结构如下图所示2.HTML常用标签及标签内的常用...原创 2020-03-17 22:07:47 · 213 阅读 · 0 评论 -
网页的组成
文章目录1.网页的组成2.计算机语言3.Web标准(一系列标准的集合)4.Html的发展5.Vsocd的使用1.网页的组成网页的组成分为:结构、表现、行为2.计算机语言html创建了 网页的结构css渲染了网页的表现Javascript引导了网页的行为3.Web标准(一系列标准的集合)W3C制定了结构和表现得标准ECMA制定了Javascript的标准4.Html的发展XHT...原创 2020-03-16 20:50:20 · 709 阅读 · 0 评论