流

原創 LucyShawYang 2018-10-03 06:40

什么是流（flow）？

流实际上就是浏览器在页面上拜访HTML元素所用到的方法。浏览器从HTML文件的最上面开始，从上到下沿着元素流逐个显示所遇到的各个元素。
每个块元素之间有一个换行；
每个内联元素在水平方向上互相挨着。
即：

块元素从上到向下流

内联元素从左上方向右下方流


当浏览器并排放置两个内联元素时

浏览器会使用他们的外边距之和来计算它们之间的空间

当浏览器上下放置两个块元素时

浏览器会把它们共同的外边距折叠在一起。即它们之间的距离为最大的外边距高度

發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章

h5新增元素之canvas渲染问题

筆試題中遇到canvas元素渲染的問題，平時不太使用canvas元素，有些疑惑，總結一二。 <canvas>是HTML5新增的，可以通過腳本（通常爲javascript）在其中繪製圖像的HTML元素。<canvas>元素本身沒有繪製能力，

Freya_yyy 2020-07-08 10:40:44

CSS应用之绘制正六边形

使用CSS繪製一個正六邊形： 具體步驟：通過繪製三個長方形進行疊加實現，其中長方形的長寬比例爲：：1。 note：設置標籤的position屬性爲absolute時，即設置爲絕對定位的元素相對於屬性不是position: static;的

Freya_yyy 2020-07-08 10:40:44

CSS实现元素水平居中、垂直居中、水平垂直居中

1.元素水平居中 1.1行內元素水平居中 1.2塊級元素水平居中       1.2.1定寬塊級元素的水平居中        1.2.2不定寬塊級元素水平居中 2.元素垂直居中 2.1 單行文本垂直居中 2.2 多行文本垂直居中 2.3塊

Freya_yyy 2020-07-08 10:40:44

h5软键盘弹出顶起页面布局问题解决

窗口改變時設置定位屬性，窗口再次改變回來的時候要把定位屬性去掉 <script> var oHeight = $(document).height(); $(window).resize(function(){

Bruce_Json 2020-07-07 13:54:04

对W3C的认识

W3C是對web代碼的規範要求： 一、對結構的要求 1.標籤字母要小寫 2.標籤要閉合 3.標籤不允許隨意嵌套 HTML標籤規範可以可以提高搜索引擎對頁面的抓取效率。 二、對於css和js的要求 1.使用外鏈css樣式表和js腳本

爱吸猫两脚兽 2020-07-07 09:29:19

新浪2010南非足球世界杯漂亮表格的制作

看到新浪2010足球世界盃主頁裏的表格非常養眼，近日抽空將表格製作代碼摳了出來，以方便日後使用。   官方網址：http://2010.sina.com.cn/   一、HTML代碼   <div class="wrap"> <tab

iteye_21255 2020-07-02 23:05:14

利用层的table-row、table-cell属性进行页面布局

利用層的table-row、table-cell屬性可以進行等高、寬度自適應頁面佈局，這是參看了《我所知道的幾種display:table-cell的應用》及《基於display:table的CSS佈局》兩篇文章給我的啓發。   一、HT

iteye_21255 2020-07-02 23:05:14

利用display:table-cell来实现等高布局

我所知道的幾種display:table-cell的應用 by zhangxinxu from http://www.zhangxinxu.com 本文地址：http://www.zhangxinxu.com/wordpress/?p

iteye_21255 2020-07-02 23:05:14

关于前端面试题css垂直居中的问题：所有的方法都在这里了

    資料： https://blog.csdn.net/u010419337/article/details/89529541  

ali是个小太阳 2020-06-30 12:21:27

css设置只显示图片的一部分

轉自：https://blog.csdn.net/zhaoyingjiao/article/details/8983967

IT小白3 2020-06-30 11:59:23

CSS3 box-shadow 效果大全

轉自：https://www.html.cn/archives/9360

IT小白3 2020-06-30 11:59:12

textarea去掉多余的空格

  轉自：https://blog.csdn.net/my_world_sky/article/details/78551351 https://blog.csdn.net/anyaoqi/article/details/8746726

IT小白3 2020-06-30 11:59:11

关于设置display:inline-block，两个div之间产生空隙的解决方法

借鑑相關文章： html - How to remove the space between inline-block elements? 轉自：https://blog.csdn.net/qq_33549229/article/det

IT小白3 2020-06-30 11:59:11

css兼容问题收集

         CSS對瀏覽器的兼容性有時讓人很頭疼,或許當你瞭解當中的技巧跟原理,就會覺得也不是難事,從網上收集了IE7,6與Fireofx的兼容性處理方法並整理了一下.對於web2.0的過度,請儘量用xhtml格式寫代碼,而且D

RdmMing 2020-06-30 05:12:11

elementui折叠面板左右标题

使用div繼承父元素的寬度和浮動來實現 <div v-for="item in aedCorrects"> <el-collapse v-model="activeName" accordion> <

Bruce_Json 2020-06-30 00:32:56