为了跟 react 的事件命名保持一致： onClick, onDrag, onChange, 等等，采用下面的格式：
HTML5学堂：伴随着科技的发展，出现了各种型号的手机，导致了HTML5移动端开发人员对页面的实现要求更高了。目前来说，移动端的实现方法没有一个统一的标准，大家各自采用自己的实现方法，所以今天就给大家分享一下各大公司移动端页面的实现方法——导航栏 给大家分享之前，先说几句话。本文章主要给大家分享不同公司对移动端的实现采用了不同的方法。每一种方法各有各的好处，我们不能说哪一种方法好，哪一种方法不好。另外，这边主要分享基本原理，没有跟各大公司移动端页面的样式一摸一样，所以仅供大家参考学习，有什么不对的欢迎大家学
最近测试给了我一大堆BUG，一瞅发现全是IE11的。吐槽一下这个浏览器真的比较特立独行。很多默认的样式跟别的浏览器不同，而且最明显的一点应该是padding左右内边距往往比别的浏览器大了一倍。但是当需要修改的时候又头疼了。如果改变原有的padding值，那么在IE11生效了。别的浏览器又有问题了。于是在网上搜了一下有没有专门针对IE11的CSShack，就是只对IE11生效的CSS样式，一查还真有。就是在CSS样式文件中加一个@media screen and(-ms-high-contrast:active),(-ms-high-contrast:none){里面是你的样式}。
block元素通常被现实为独立的一块，独占一行，多个block元素会各自新起一行，默认block元素宽度自动填满其父元素宽度。block元素可以设置width、height、margin、padding属性；
看到了一个这样的提问：一个表中有id和name两个字段，id是连续非空不重复的，想要交换相邻表记录的name值（单双两两交换）。
写这篇文章的起因是源于这篇文章：谈谈面试与面试题 中关于position的讨论，文中一开始就说的这句话： 面试的时候问个css的position属性能刷掉一半的人这是啥情况…… 其实这问题我本来打算的是可以顺着一路扯到normal flow、containing block、bfc、margin collapse，base line，writing mode，bidi，这样一路问下去的，奈何第一个问题（亲我真的只问了position有哪些取值和行为啊）就悲剧了…… 说到position，那么稍微对c
浮动元素和绝对定位元素，非块级盒子的块级容器（例如 inline-blocks, table-cells, 和 table-captions），以及overflow值不为“visiable”的块级盒子，都会为他们的内容创建新的BFC（块级格式化上下文）。
在解释什么是BFC之前，我们需要先知道Box、Formatting Context的概念。
在普通流中，元素按照其在 HTML 中的先后位置至上而下布局，在这个过程中，行内元素水平排列，直到当行被占满然后换行，块级元素则会被渲染为完整的一个新行，除非另外指定，否则所有元素默认都是普通流定位，也可以说，普通流中元素的位置由该元素在 HTML 文档中的位置决定。
在写css样式时，可能是添加了一个样式后就达到了预期效果。有没有想过，是我们在不经意间触发了什么，帮助我们达到了效果？本文就快速介绍下css样式中经常使用的BFC，主要包括以下几个方面：
如何清除浮动 大家都知道，浮动会对文档产生影响，具体来看看会对文档产生什么影响？ 清除浮动后的效果： 未清除浮动后的效果： 实例代码（未清除浮动）： <!doctype html> <html> <
工作中其实经常用到一些span标签和div标签来进行内容的显示，但涉及到文本标签的换行，总得多花那么一两分钟多写一下，今天就专门来瞅一瞅。
本节所有的代码: https://download.csdn.net/download/qq_44273429/12729648 未完待续，，， 下一节链接: Web前端基础（04）
可以看出由于margin-top:20px;margin-bottom:20px，应该显示40px但是只显示20px，是什么原因呢？这就涉及到BFC
版权声明：本文为博主原创文章，欢迎转载，转载请注明出处。 https://blog.csdn.net/FE_dev/article/details/68954481
BFC全称是Block Formatting Context，即块格式化上下文。它是CSS2.1规范定义的，关于CSS渲染定位的一个概念。
前言 盒子模型作为CSS基础中的基础，曾一度以为掌握了IE和W3C标准下的块级盒子模型即可，但近日在学习行级盒子模型时发现原来当初是
对一个十进制数的各位数字做一次平方和，称作一次迭代。如果一个十进制数能通过若干次迭代得到 1，就称该数为幸福数。1 是一个幸福数。此外，例如 19 经过 1 次迭代得到 82，2 次迭代后得到 68，3 次迭代后得到 100，最后得到 1。则 19 就是幸福数。显然，在一个幸福数迭代到 1 的过程中经过的数字都是幸福数，它们的幸福是依附于初始数字的。例如 82、68、100 的幸福是依附于 19 的。而一个特立独行的幸福数，是在一个有限的区间内不依附于任何其它数字的；其独立性就是依附于它的的幸福数的个数。如果这个数还是个素数，则其独立性加倍。例如 19 在区间[1, 100] 内就是一个特立独行的幸福数，其独立性为 2×4=8。
前两期分别给大家总结了获取标签的方法和设置样式的方法，如果想具体了解获取标签的方法和设置样式的方法，可以回复“获取标签”和“设置样式”到“HTML5学堂”公众号。在实现页面交互效果的时候，操作标签的内容是必不可少的，所以今天我们要给大家总结的是操作标签的内容。 本文内容概要： 1 innerHTML与outerHTML属性 2 innerText与outerText属性 3 课后作业 1 innerHTML与outerHTML属性 前几期我们接触了innerHTML属性，利用它来获取和设置标签的内容，具体我
最近项目中有一接口返回的一个字段是html格式的字符串，里边每个div中style的高度是固定的px，然后再手机端显示的时候发现，div中的内容重叠了；效果图如下：
写css，你少不了与margin打交道。你真的了解margin吗？你知道margin有什么特性吗？你知道什么是垂直外边距合并？margin在块元素、内联元素中的区别？什么时候该用padding而不是margin？你知道负margin吗？你知道负margin在实际工作中的用途吗？常见的浏览器下margin出现的bug有哪些？……
1. 说下行内元素和块级元素的区别？行内块元素的兼容性使用（IE8 以下） Q1)行内元素：会在水平方向排列，不能包含块级元素，设置width无效，height无效(可以设置line-height)，margin上下无效，padding上下无效。 块级元素：各占据一行，垂直方向排列。从新行开始结束接着一个断行。 Q2)兼容性：display:inline-block;display:inline;zoom:1; 2.清除浮动有哪些方式？比较好的方式是哪一种？ 1）父级div定义height。 2）结尾处加空
HTML5学堂：熟悉JavaScript的人对document.getElementsByTagName再熟悉不过，对arguments也多有耳闻，我们时常针对其进行遍历，通过数组下标进行访问，但是它们却是数组中的“冒牌货”，一起来看今天要说的“伪数组”。 何为伪数组 伪数组（类数组）：无法直接调用数组方法，也无法使用length属性实现什么特殊的行为，但是！可以使用真正数组遍历的方法（for循环配合数组下标）来遍历它们。 说的浅显一些，就是：存在着length属性，可以通过数组下标的方式进行每个元素的访问
作为一个前端小白，入门跟着这四个来源学习，感谢作者的分享，在其基础上，通过自己的理解，梳理出的知识点，或许有遗漏，或许有些理解是错误的，如有发现，欢迎指点下。
Html 标签学习 排版标签 标题 h1、h2、h3、h4、h5、h6只有这六个 段落标签 p标签 段落之间有空隙换行 换行标签 br 空换行 hr 下划线换行 文本格式化标签 根据语境区分 b、strong 加粗 u、ins 下划线 i、em 倾斜 s、del 删除线 媒体标签 图片标签img 属性名、属性值 alt属性值作为替换文本、src属性作为图片链接、title属性在鼠标悬停时显示 width、height 很容易理解，控制图片宽高 路径 相对路径 绝对
BFC全称”Block Formatting Context”, 中文为“块级格式化上下文” BFC元素特性表现原则就是：内部子元素不会影响外部的元素。
在前几期的文章当中，我们学习了JS的基础语法，它是我们学习其它知识点的重要前提。小编也与大家分享了JS逻辑与DOM的相结合，并带着大家去实现了一些简单的页面交互效果，涉及了获取标签—>绑定事件—>操作标签样式。而今天的文章主要带着大家来分析其它获取标签的方法，这样才能更灵活的去获取网页中的标签。 本文内容概要： 1 回顾通过ID名获取标签的方法 2 获取标签的其它方法 3 课程小结 4 课后作业 1 回顾通过ID名获取标签的方法 ID名获取标签需要给标签起一个ID名，然后通过getElementById()
some inline text more text
more text
就可以将a标签转换成块元素，然后就可以对其指定宽度和高度了，这样我们就可以实现一个有宽度和高度的链接元素了。
本系列面试题旨在学会相关知识点，从而轻松应对面试题的各种形式，本文讲解了前端常用的几种布局方式，包括 两栏布局，三栏布局，圣杯布局，双飞翼布局。
1.什么是Bootstrap？ 1.Bootstrap是2011年Twitter团队为了方便维护PC端和手机端二研发的一个响应式前端框架。 2.用于快速开发Web应用程序和网站的前端框架 3.Bootstrap是基于HTML、CSS、JS的，简介灵活，使Web开发更加快捷 4.总结：Bootstrap是一个建立在一个页面，可以在三个中断(PC、平板、手机)上完美战士的响应式前端框架 2.Bootstrap的环境配置： 19:021.到Bootstrap官网下载Bootstrap
通过前三篇的学习，相信你们对HTML有了一些基础的了解，那么我们就来先做一个小练习，巩固一下之前所学习的知识。
前几天我在面试前端开发同学的时候，有问到关于margin基础布局相关内容的过程中，发现很多同学基本解释不清楚，今天刚好有点时间就整理了一篇笔记出来。就以下5点在CSS布局经常会用到的经典布局解决方案。
总是忘记给ie做特殊样式处理，以前打游击，不做也就算了，以后可不行，得对自己的“孩子”负责。。 一、先说IE老大的兼容 知道了一些常用的css属性兼容方法确实可以解决问题， 但我不知道我自己的ieTester是不是假的，很多网上说的ie8能识别、ie6,7不能识别的符号，我的ieTester6,7还是能识别。针对ie的兼容还有后缀\9\0写道一起的方法，说是只针对ie9，其实ie8也可以、怀疑自己用的是假的ie9。 总结了一些，常见的IE hack写法，对比正常写法，列表及实际功能如下 backgrou
标准流在最底层 (海底) ------- 浮动 的盒子 在 中间层 (海面) ------- 定位的盒子 在 最上层 （天空）
因为一些网页布局要求，标准流不能满足我们的需要了，因此我们需要浮动来完成网页布局。
HTML+CSS 一个div里面有个img标签，div的高度由img撑开；img的兄弟级有个div要使内层div的高度等于外层div的高度，除了用JS实现，还能怎么实现？ 2016.05.16~2016.06.20 核心概念 flex、position、display 参考答案 结构： HTML5 设置多栏多列布局display
浮动是可视化格式模型中非常重要的一节。浮动跟stack level也有一定的关系。可视化模型是一个3维的模型，并不是二维的。元素在页面上的排列，从我们的角度看是二维的，元素的位置可以用x，y轴坐标来表
并集选择器：每组选择器可以是基础选择器或复合选择器，每组选择器通常一行写一个，提高代码的可读性
1.脱离文本流的元素具有行内的块元素的特性（不换行，能设置宽高），无论原来是行元素还是块元素–例：图文绕排。
我想你每天写css代码有时候也会觉得很痛苦：这个布局的css怎么这么难实现！我也经常会有这种感觉，一个看似简单的布局总是要琢磨半天才能实现，偶尔还会出现一些怪异的超出理解的现象。这是因为我们对css只是大概知道个形，并没有看透css的本质。在同事的推荐下我阅读了张鑫旭老师的《css世界》，才发现css跟想象中的不太一样。本文为《css世界》个人总结笔记，为缩减篇幅丢弃了张老师冗余的小幽默，丢掉了些含金量较低的章节内容，因为ie已经被淘汰出局，所以有关css兼容性的地方也全部忽略不记，同时对个人觉得不易理解的地方加上了一些自己的理解和验证，所以错误之处还望指正。顺便推荐个好用的在线代码编辑工具，国内镜像站点，方便各位对本文实例进行测试。另外本文会随着作者对css的更深入理解而逐步更新，希望到最后能够文如标题展现出真正的css世界。
CSS选择器分为 基础选择器 和 复合选择器 ，但是基础选择器不能满足我们实际开发中，快速高效的选择标签。
我们使用float浮动做了很多其本职工作以外的事情，于是我们会混淆，我们会回看不清float真正的面目。浮动真正的意义在哪里呢？要知道这个问题的答案很简单，假设现在CSS中没有浮动(float)属性，那么会变成一个什么样子。我们会发现，目前流行采用浮动方法实现的无论是分栏布局，还是列表排列我们都可以用其他一些CSS属性（不考虑table）代替实现，唯一一个实现不了的就是“文字环绕图片”，我是想不出来能有什么方法可以让文字环绕图片显示。好，这个替代不了的作用才是float真正的意义所在。此作用类似于word中的版式，很基础的原始的作用：
CSS是层叠样式表（Cascading Style Sheets）用来定义网页的显示效果。可以解决html代码对样式定义的重复，提高了后期样式代码的可维护性，并增强了网页的显示效果功能。简单一句话：CSS将网页内容和显示样式进行分离，提高了显示功能。 那么CSS和HTML是如何在网页代码中相结合的呢？通过四种方式：style属性 、style标签、导入和链接。
一个水平流上只能单独显示一个元素，因此理论上都可以配合clear属性来清除浮动带来的影响。
CSS篇主要从CSS兼容、CSS3新特性、CSS选择器、高频属性、高频布局、高频知识点、性能优化等方面进行归纳。如对HTML知识点感兴趣，可移步至：知识整理之HTML篇
1.margin与百分比单位 Paste_Image.png Paste_Image.png 2.margin重叠 margin重叠通常特性： 只发生在block水平元素（例如：p、div、list、
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储
