张大晴的博客

xx::after{ content: ''; position: absolute; width: 100%; height: 2px; left: 0px; bottom: 0px; } xx{ ...

需求描述：在a.html页面，嵌入一个iframe. 在a.html中点击一个图标，让iframe全屏展示，并且iframe展示其他页面的内容知识点：注意：当窗口全屏，keyup,keydown类似事件是监听不到esc按键的，这是浏览器一个安全机制。如果不是全屏模式还是可以监听到的。全屏的操作：借鉴文档：https://blog.csdn.net/k358971707/article/detail...

引入less方式：4种1直接引入less文件2.koala编译器  下载编译器网址  http://koala-app.com/用编译器3.用node服务器npm    3.1先下载安装 node   3.2查看node是否安装成功：   注意：如果报错则需要修改环境变量，百度查找即可3.3使用npm管理包工具安装less其中-g代表全局安装npm install less -g这样应该代表成功了...

 本文转自：http://blog.sina.com.cn/s/blog_969555e3010135s6.htmlcss2中有五个与背景相关的属性。它们是：background-color:完全填充背景的颜色                     background-image:用作背景的图片                            background-pos...

文章转自：https://www.cnblogs.com/luoxiaowei/p/6952104.html参考文章：https://blog.csdn.net/qq_39186346/article/details/81941664http://www.ruanyifeng.com/blog/2017/05/websocket.html原理：https://www.zhihu.com...

文章转自：https://blog.csdn.net/junjun222222/article/details/78121466

一般情况下，onblur事件只在input等元素中才有，而div却没有，因为div没有tabindex属性，所以要给div加上此属性。如： 1 <div tabindex="0" hidefocus="true" onfocus='alert("得到焦点");' onblur='alert("失去焦点");' style="border:1px solid...

前端引用路径的解析1、客户端路径(客户端目录)href、src、url里的相对地址、完整地址是被浏览器解析的，称为客户端路径。下面仅对相对路径进行描述。遵循的原则：/指根路径 ../回到上一级路径./当前路径上述路径均指浏览器地址栏里的路径，而非服务器上的实际物理路径。 例：浏览器地址栏为 http://localhost:9099/a/b   那么  hre...

思路：a标签套img<a href="/xx"> <img src="xxxx" class="aa" alt=""/></a>兼容IE8：消除IE下a标签点击后出现的虚线框并非原创，只是记录一下以备不时之需：<a href="#" onfocus="this.blur();">这里设置聚焦时触发blur();...

当内容宽度超过容器宽度，会出现折行的问题。但是有的时候我们不希望折行的部分在完整的词（英文或中文）中。这种情况如何处理呢？解决方式：给每一个完整的词组中加入span,给span设置white-space:nowrap(不换行)。这样就可以保持词组完整的不换行。效果：...

UI一般设计图的图片会比正常的尺寸大，苹果的分辨率比正常的电脑大2倍的像素。当拿到设计图以后所有用ps量的尺寸（宽高）需要除2当图片过大，我们应该怎么处理：外层div设置固定尺寸。如果用过大的图片当成背景。只要给元素设置background-size:100%或者background-size:cover即可。...

&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Title&lt;/title&gt; &lt;script src="./js/echarts.min.js"&g

参考文章：https://blog.csdn.net/m0_37585915/article/details/78501760https://zhuanlan.zhihu.com/p/25321647https://www.w3cplus.com/css/understanding-bfc-and-margin-collapse.htmlBFC 概念Formatting context(格式化上下...

块元素：不管内容多少，块元素都会在浏览器中独占一行。可设置宽高，如果不设置宽高那么它的宽度是100%（占满父级元素一整行）    缺点：1.相邻元素垂直。相邻外边距会重叠。margin-bottom和margin-top重叠（重叠之后的值是两个值中的最大值）                第一种解决方案：原理bfc相关               2.父子的相邻，父元素的margin-top和子元...

sessionStorage,localStorage   H5新增的两种存储方式不同点：sessionStorage临时会话存储，存储量 5M。当当前窗口关闭。sessionStorage存储内容消失。例子：&lt;body&gt; &lt;a href = 'file:///F:/泰牛程序员/实验案例--张雨晴/tainiu/H5--存储/存储2.html' target='_blank'...

当子级元素浮动如何解决子集元素产生的浮动问题？divc和divb都设置了float:left.导致两个div同时脱离了文档流。父级div认为没有元素存在，所以高度为0.这就是当子级元素浮动如何解决子集元素产生的浮动问题。解决方式如下：1.给父级div设置高度(height)原理：父级div手动定义height，就解决了父级div无法自动获取到高度的问题。 优点：简单、代码少、容易掌握 缺点：只适合...

 文章来自：https://blog.csdn.net/Cinderella_hou/article/details/52156333所谓三列自适应布局指的是两边定宽，中间block宽度自适应。这道题在今年网易内推前端工程师面试的时候也被问到。 我这里主要分为两大类，一类是基于position传统的实现，一类是基于css3新特性弹性盒模型布局实现。 1. 基于传统的position和margin等...

1.左边定宽，右边自适应用负margin的方式实现&lt;style&gt; .wrap{ overflow:hidden; } .right-container{ float:left; width: 100%; } .right{ margin-left: 200px; background: red; } .left{ width: 200px; f...

文章来源：https://segmentfault.com/q/1010000008800083给你个例子- -html &lt;div class="wrap"&gt; &lt;img src="images/ico.png" alt=""&gt; &lt;span&gt;Lorem ipsum dolor sit amet consectetur adipi..

文章来自：https://blog.csdn.net/coder_chang/article/details/72777943一、优先级分类通常可以将css的优先级由高到低分为6组：第一优先级：无条件优先的属性只需要在属性后面使用！important。它会覆盖页面内任何位置定义的元素样式。ie6不支持该属性。第二优先级：在html中给元素标签加style，即内联样式。该方法会造成css难以管理，所...

文章来源：https://www.cnblogs.com/clearsky/p/5696286.html参考文章：https://blog.csdn.net/m0_37585915/article/details/78501760参考文章：https://blog.csdn.net/m0_37585915/article/details/78501760css 盒子模型理解盒子模型是html+cs...

1、盒子阴影样式单词：box-shadow2、语法div{box-shadow:0 0 1px #000 inset;} 代表边框间距靠左0 靠上0 和1px阴影范围 阴影颜色为黑色（#000），有inset 代表框内阴影 ，不带inset 代表框外阴影。注意：box-shadow:0px 0px 1px #000第1个值为0时，代表左右边框阴影 为1px范围第1个值为正整数 代表 左边框阴影第1...

body  -- 只需清空margin行。它没有默认的paddingul -- 有默认的margin 和padding 都需要清空li  -- 没有默认magin 和 padding 不用清空

关于margin-right失效的问题：浏览器默认从左往右渲染元素，在没有超出父容器的宽度的前提下  如果子容器的宽度能够被容纳  设置margin-right是没有用的...

浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。由于浮动框不在文档的普通流中，所以文档的普通流中的块框表现得就像浮动框不存在一样。文字的特点：不会钻入到任何东西的下边。（注：如果上层被设置position:absolute的div覆盖，则被覆盖的下一层div中则文字不会展示出来）浮动就是个带有方位的display:inline-block属性它脱离文档流，所以它不占据...