自我评价:走在路上的菜鸟,想着CMS|WEB|SEO,做着可以成为牛掰程序seoer的梦!

当前位置:博客 > 前端开发 > HTML|CSS代码 >

文档流和脱离文档流

作者:灰牛站长•发布时间:2021-07-12 11:06:23•浏览
  1. 文档流:指的是元素排版布局过程中,元素会自动从左往右,从上往下的流式排列。并最 终窗体自上而下分成一行行,并在每行中从左至右的顺序排放元素
  2. 每个非浮动块级元素都独占一行,浮动元素则按规定浮在行的一端。若当前行容不下 则另起新行再浮动
  3. 内联元素也不会独占一行;几乎所有元素(包括块级,内联和列表元素)均可生成子行,用 于摆放子元素
  4. 标准文档流等级:分为两个等级块级元素和行内元素;
  5. 脱离文档流:文档流内的正常元素识别不到这个元素了(脱离文档流的元素相当于平行漂浮在文档流之上)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
/*
文档流:指的是元素的排列方式
正常文档流:从左往右 从上往下排
文档流可以分等级:行内元素和块级元素
=>行内元素从在往右
=>块级元素从往下
引申出一个面试题:行内元素和块级元素的特点,请列举说明
需求:需要块级元素(比如:d1v)在一行显示
脱离文档流:元素的正常排列方式被打破
离文档流的影啊
1.float
2.定位
*/
</style>
</head>
<body>
<a href="javascript:;">超链接</a>
<span>行内</span>
<dl>
<dt>书签</dt>
<dd>说明</dd>
</dl>
</body>
</html>
上一篇:浮动元素的特点 下一篇:浮动元素的值

相关文章

  • 代码技巧之常用快捷键的整理

    代码技巧之常用快捷键的整理

    常用快捷键的整理 ctr1+C复制 ctr1+V粘贴 ctrl+Z撤销 回到上一步操作 ctr1+D复制整行 ctr1+Z剪切整行 增加/删除单行注释ctrl+/ 增加/删除多行注释ctrl+shift+/ html注释...
    2021-07-12 11.07.53
  • z-index的特点

    z-index的特点

    思路: ➥z-index的结构/定位元素默认的z-index ➥z-index单位 ➥能不能用子元素和父元素比较 ➥父元素没有z-index,能不能通过子元素控制他们的层级=改变层级...
    2021-07-12 11.07.57
  • 定位元素的异同点

    定位元素的异同点

    定位的值 position: absolute绝对定位 position: relative相对定位 position: fixed固定定位 定位的相同点和不同点 ===相同点: 可以 设置top/ bottom/ left/right四个方位值,如...
    2021-07-12 11.07.09
  • 定位之固定定位

    定位之固定定位

    固定定位- position: fixed 脱离文档流; 参照物是浏览器的可视窗口;任何元素都可以设置固定定位; 可设置top/ bot tom/left/ right四个方位 可通过z-index改变层级 !...
    2021-07-12 11.07.38
  • 定位之绝对定位

    定位之绝对定位

    定位元素元素层级元素定位滚动条 绝对定位- position: absolute;特点 脱离文档流 可以设置参照物,参照物必须是其父级元素(直系父级),如果直接父级没有会一直...
    2021-07-12 11.07.13

手机端