关于前端的一些细节内容补充

---

前言

生活中处处是细节,编程里处处是坑

记录一下那些没有注意到的细节问题吧

---

一、块级标签与行级标签、行级块标签

名称	块级标签	行级标签	行级块标签
占据大小	独占一行	内容决定元素所占位置	内容决定元素所占位置
css控制	可以通过css来改变宽高	不可以通过css来改变宽高	可以通过css来改变宽高
display属性值	block	inline	inline-block

常见块级标签:div、p、ul/ol、form等
常见行级标签:span、a等
常见行级块标签img等

二、样式控制

1.文本格式

• 文本修饰text-decoration
  line-through : 可以用作删除线
  underline : 下划线
• 文本垂直居中
  即行高等于字体大小,让"line-height"和"font-size"的属性值大小相同

2.定位position

• absolute
  脱离原来位置进行定位.即相对于最近的有定位的父级元素进行定位,否则相对于文档(窗口页面)定位.可以理解为"分层".
• relative
  保留原有位置进行定位.即相对原来位置进行地位.
• fixed
  相对页面定位.在有滚动条的页面中始终有展示.
• 用法 :
  我们通常用relative来定位参照物,absolute来进行相对定位.
  原因:
  如果用absolute来定位参照物,将会影响后面子元素的定位.absolute是分层,元素可以任意"飘来飘去的",它释放了原来的位置,可以被其他元素所占用.

3.改变原有渲染格式

BFC

block format context,块级格式化上下文,可以通过这些属性来改变渲染格式.
例如:

position:absolute
display: block/inline
float: left/right
overflow: hidden

---

总结

以上就是今天要讲的内容，本文仅仅简单记录一下今日所学.