![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
html
文章平均质量分 60
徕胖
凡事到最后必将皆大欢喜!
展开
-
重绘和重排
重排是DOM元素的几何属性变化,DOM树的结构变化,渲染树需要重新计算。重绘是一个元素外观的改变所触发的浏览器行为,例如改变visibility、outline、背景色等属性。浏览器会根据元素的新属性重新绘制,使元素呈现新的外观。优化:减少回流和重绘将多次改变样式属性的操作合并成一次操作。如果要批量添加DOM,可以先让元素脱离文档流,操作完后再带入文档流,这样只会触发一次重排。(fragment元素的应用)将需要多次重排的元素,position属性设为absolute或fix...原创 2021-07-25 10:32:25 · 153 阅读 · 0 评论 -
script标签以及async和defer属性 (异步加载js代码)
defer(延迟)属性:仅适用于外部脚本(即只有在使用 src 属性时,该属性才有效),规定对脚本执行进行延迟。下载脚本时不阻塞页面的解析执行,直至页面加载解析执行完成后,才开始执行脚本。async(异步)属性:适用于外部脚本(即只有在使用 src 属性时,该属性才有效),规定异步执行脚本。下载时不会阻塞页面的解析执行,下载完成后立刻执行脚本,此时,如果页面没有解析执行完,则会阻塞页面加载解析。(注意:如果同时指定了两个属性,则会遵从async属性而忽略defer属性。)只有一个脚本情况...原创 2021-07-25 09:28:32 · 507 阅读 · 0 评论 -
domcontentloaded和load的区别
原创 2021-07-25 08:59:18 · 99 阅读 · 0 评论 -
css——三栏布局
圣杯布局 <style> /* 三个部分都设定为左浮动,否则左右两边内容上不去,就不可能与中间列同一行。 然后设置center的宽度为100%(实现中间列内容自适应),此时,left和right部分会跳到下一行 通过设置父容器的padding-left和padding-right,让左右两边留出间隙。 通过设置margin-left为负值让left和right部分回到与center部分同一行 通过设置相对定...原创 2021-07-24 10:52:36 · 91 阅读 · 0 评论 -
css3中过渡(transition),转换(transform),动画
1.过渡(transition)所谓过渡其实是css3中新增的一个动画效果。上述代码的效果是当鼠标悬浮在div上时,div的宽会由200px慢慢增加到400px。当鼠标离开div时,div的宽会由400px慢慢减少至200px。如果想给元素的多个属性添加过渡效果:或者2.转换transfrom(包括移动,旋转,缩放)(1)2d转换之移动translate 到目前为止,一共学了三种移动盒子位置的方式:定位,盒子外边距以及利用2d转换移动 translate应用场景原创 2021-07-16 21:55:13 · 710 阅读 · 0 评论 -
html5新特性
html5新增的特性主要是针对以前的不足,如导航栏,侧边栏等都是用div实现的,这样不利于seo。所以Html5中新增了一些标签,表单以及表单属性。这些新特性一般都有兼容性问题,基本上是ie9以上版本的浏览器才支持,如果不考虑兼容性,可以大量使用这些新特性。html5新增的语义化标签html5新增的多媒体标签——视频标签html5新增的多媒体标签——音频标签html5中新增的input标签类型(即type属性的取值)多了html...原创 2021-07-16 11:14:55 · 75 阅读 · 0 评论 -
块级格式化上下文BFC
BFC(Block formatting context)直译为"块级格式化上下文",它既不是一个css属性,也不是一段代码。而是css2.1规范中的一个概念。可以将bfc看成元素的一个属性,触发了元素的bfc后,此时元素就相当于一个箱子,是一个独立的渲染区域。bfc布局规则BFC有隔离作用,BFC中的内部元素不会受外部元素的影响(反之亦然)在一个BFC中,元素按照正常文档流排列在一个BFC中,两个相邻的块盒子在垂直方向的margin会合并BFC中的内容不会与外面的浮动元素重叠计算BFC的.原创 2021-07-07 20:52:06 · 84 阅读 · 0 评论 -
css——浮动布局(float)以及清除浮动
浮动方式布局就是使用 float 属性,使元素脱离文档流,浮动起来。浮动布局的特点:会让元素脱离文档流(不占据原来的位置),但同时也会有一些副作用(高度塌陷)为什么需要浮动? 有很多布局效果,标准流布局无法完成,因为浮动可以改变元素标签默认的排列方式。举例说明:让多个块级元素在一行显示方式1:标准流布局方式是将块级元素的display属性设置为inline-block,但这样虽然可以实现,但他们之间会有空白间隙,不好控制。方式2:可以将,这些块,都设置浮动(即添加float属性),并且浮动方向相.原创 2021-07-07 10:42:52 · 787 阅读 · 0 评论 -
css3新特性
css3新增了更多的选择器(属性选择器,结构伪类选择器,伪元素选择器)css3新增了2D和3D转换、动画,过渡,渐变,等等原创 2021-06-27 15:27:52 · 57 阅读 · 0 评论 -
如何区分 HTML 和HTML5、XHTML
1.HTML 和HTML5区别首先要注意的是,HTML5虽然现在很火,但是HTML5标准还在制定中,标准仍在改变。HTML4已经10多年了,不会有任何改变了。HTML 和HTML5区别(1)文档的类型声明不同如下:(2)html中新增了很多新标签以及功能,如:html5:添加了许多具有语义化的标签,使代码结构清晰,提高了代码的可读性。html5中还新增了用于媒介回放的 video 和 audio 标签;html5中新增绘图标签canvashtml5对本地离线存储有更好的支持原创 2021-06-27 10:51:49 · 156 阅读 · 0 评论 -
vue面试(三)——组件(或实例)生命周期以及父子组件生命周期执行顺序
vue生命周期函数又叫生命周期钩子,是在某个时刻会自动执行的函数vue组件又叫实例,所以将组件生命周期又叫实例生命周期参考链接 (1)创建期间的生命周期函数vue生命周期函数又叫生命周期钩子,是在某个时刻会自动执行的函数vue组件又叫实例,所以将组件生命周期又叫实例生命周期beforeCreate是在vue组件或实例创建完成之前执行。created是在vue组件或实例创建完成之后执行。beforeMount是在模板渲染到页面上之前会执行mounted是在模板渲染到页面完...原创 2021-05-21 14:29:54 · 341 阅读 · 2 评论 -
web开发模式(服务端渲染,客户端渲染(前后端分离)以及如何选择web开发模式)
目前主流的Web开发模式,大致分类两种:(1) 基于服务器端渲染的传统Web开发模式 (SSR Server side rendering服务器端渲染)(2) 基于前后端分离的新型Web开发模式 (CSR Client side rendering客户端渲染)何为渲染?页面上的数据要发生更新,就是渲染。这个工作放在服务器进行就是服务器端渲染,放在浏览器进行就是浏览器端渲染。何为渲染?如果我们只是想显示一堆不变的数据,那么我们直接写一个a.html丢到服务器上让客户端访问就可以了.原创 2021-05-18 10:42:54 · 1037 阅读 · 3 评论 -
html5本地存储——sessionStorage和localStorage
sessionStorage和localStorage数据的存储以及获取,以及两者的区别html5中提供了两种本地存储的方式:localStorage(本地存储)和sessionStorage(会话存储)window.sessionStorage(会话存储):暂时储存,浏览器关闭之后会清除window.localStorage (本地存储):本地储存,浏览器关闭之后依旧不会清除,只能人为删除平时储存的话建议使用sessionStorage;本地存储特性:1.数据存储在用户浏览器中2.设置.原创 2021-05-17 22:32:49 · 1244 阅读 · 0 评论