前端
文章平均质量分 61
NOT FOUND 404!
这个作者很懒,什么都没留下…
展开
-
清除浮动(解决高度塌陷)
一、什么是父元素高度塌陷<html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .parent{ width: 50原创 2021-07-31 16:19:24 · 127 阅读 · 0 评论 -
深入了解BFC
一、什么是BFCFormatting context 是 W3C CSS2.1 规范中的一个概念。它是页面中的一块渲染区域,并且有一套渲染规则,它决定了其子元素将如何定位,以及和其他元素的关系和相互作用。最常见的 Formatting context 有 Block fomatting context (简称BFC)和 Inline formatting context (简称IFC)。Block formatting context直译为"块级格式化上下文"。它是一个独立的渲染区域,只有Block-l原创 2021-07-31 16:06:19 · 135 阅读 · 0 评论 -
CSS不限宽高的居中方式(9种最全)
前言垂直居中,在 CSS 中是一个老生常谈的问题,面试的时候也会时常被提及。所以,今天我们就来聊聊 9 种不同的居中方法。有常见的 flex、transform、absolute 等等。也有 CSS3 的网格布局。还有伪元素的方法,是的,你没有看错,::after 和 ::before 也可以实现居中。9 种方法呈现1、flex大家的第一反应,可能就是 flex 了。因为它的写法够简单直观,兼容性也没什么问题。是手机端居中方式的首选。<div class="wrapper flex-cent原创 2021-07-31 15:55:44 · 869 阅读 · 0 评论 -
变量声明和函数声明的提升问题
问题描述:变量声明提升:输出a,b的值都为undefined<script type="text/javascript"> console.log(a); var a; console.log(b); var b = 3; </script>函数声明提升:报错,add4 not a function原因分析:变量声明会默认提升到最前面,但是赋值不会提到前面,也就是相当于按照这个顺序执行var a,b;console.log(a,b);原创 2021-07-21 21:15:21 · 89 阅读 · 0 评论 -
循环中continue使用的常见错误
问题描述:举个简单的案例:求整数1~100的累加值,但要求跳过所有个位为3的数。var sum = 0,i=1; while(i<=100){ if(i % 10 == 3){ continue; } sum+=i; i++; console.log(i+","+sum); }结果浏览器一直在转,得不出答案;原因分析:if(i % 10 == 3){ continue; }continue;代表跳过本次循原创 2021-07-19 23:39:47 · 1921 阅读 · 0 评论 -
仿苹果响应式官网(含代码!)
一、响应式开发原理1.1 响应式开发原理就是使用媒体查询针对不同宽度的设备进行布局和样式的设置,从而适配不同设备的目的。设备的划分情况:+ 小于768的为超小屏幕(手机)+ 768~992之间的为小屏设备(平板)+ 992~1200的中等屏幕(桌面显示器)+ 大于1200的宽屏设备(大桌面显示器)1.2 响应式布局容器响应式需要一个父级做为布局容器,来配合子级元素来实现变化效果。原理就是在不同屏幕下,通过媒体查询来改变这个布局容器的大小,再改变里面子元素的排列方式和大小,从而实现不同屏原创 2021-07-10 15:45:33 · 4253 阅读 · 8 评论