手机H5能进行nfc写入数据 h5 bfc

目录

• H5常用的语义化标签
• bfc的解决方法

语义化的好处

1、html结构清晰，代码可读性较好，便于团队维护和开发

2、更有利于搜索引擎或辅助设备理解html页面内容，搜索引擎可以根据标签语言确定上下文和权重关系

H5常用的语义化标签

<section>    用于对网站和页面内容分块，划分单独的模块区域

 <article>独立的文章展示

 <aside>页面中的附属侧边信息

 <header>：定义页面或内容的头部区域

<footer>：定义页面或内容的底部区域

<nav>：定义页面导航

<figure>表示一个独立的内容

  <main>表示页面的主体内容（一个页面只能使用一次）

 <hgroup>表示对网页或区段的标题进行组合，通常对h1~h6进行分组

<mark>用来突出显示文本,默认情况下背景为黄色

bfc的解决方法

之前遇到的一些问题：
1.外边框塌陷
2.外边框重合
3.浮动对普通元素的影响

BFC：block formatting context 块级格式化上下文。
官方解释为：它决定了元素如何对其内容进行定位，以及与其他元素的关系和相互作用。BFC提供了一个环境，HTML元素在这阁环境中会按照一定规则进行布局。
说人话：BFC的目的就是形成一个独立的空间，在这个空间内的子元素不会在布局上影响到外面的元素。

生成BFC

1：overflow 不为visible（对溢出内容不做处理，内容可能会超出容器），

可以让属性为：hidden（溢出隐藏） auto scroll。

2：浮动 float不为none。

只要设置了浮动，当前元素就拥有了BFC属性。

3：定位 默认和相对定位不会创建BFC空间。

绝对定位和固定定位。

4：display inline-block（行内快） table-cell（指定对象作为表格单元格。）
flex（弹性子盒子内容） inline-flex

BFC应用：
1.解决margin塌陷
2.父类高度塌陷
3.阻止元素被浮动元素遮盖