通過浮動可以使乙個元素向其父元素的左側或右側移動, 使用 float 屬性來設定於元素的浮動, 可選值：
注意，元素設定浮動以後，水平布局的等式便不需要強制成立,元素設定浮動以後，會完全從文件流中脫離，不再占用文件流的位置，所以元素下邊的還在文件流中的元素會自動向上移動
浮動的特點：
浮動元素會完全脫離文件流，不再佔據文件流中的位置
設定浮動以後元素會向父元素的左側或右側移動，
浮動元素預設不會從父元素中移出
浮動元素向左或向右移動時，不會超過它前邊的其他浮動元素
如果浮動元素的上邊是乙個沒有浮動的塊元素，則浮動元素無法上移
浮動元素不會超過它上邊的浮動的兄弟元素，最多最多就是和它一樣高
簡單總結： 浮動目前來講它的主要作用就是讓頁面中的元素可以水平排列， 通過浮動可以製作一些水平方向的布局.
設定了float的浮動元素不會蓋住文字，文字會自動環繞在浮動元素的周圍，所以我們可以利用浮動來設定文字環繞的效果.
元素設定浮動以後，將會從文件流中脫離，從文件流中脫離後，元素的一些特點也會發生變化
脫離文件流的特點：
塊元素不在獨佔頁面的一行
脫離文件流以後，塊元素的寬度和高度預設都被內容撐開
行內元素脫離文件流以後會變成塊元素，特點和塊元素一樣
脫離文件流以後，不需要再區分塊和行內了.
bfc(block formatting context) 塊級格式化環境
開啟bfc的元素不會被浮動元素所覆蓋
開啟bfc的元素子元素和父元素外邊距不會重疊
開啟bfc的元素可以包含浮動的子元素
設定元素的浮動（不推薦）
將元素設定為行內塊元素（不推薦）
將元素的overflow設定為乙個非visible的值
如果我們不希望某個元素因為其他元素浮動的影響而改變位置，可以通過clear屬性來清除浮動元素對當前元素所產生的影響
clear
left 清除左側浮動元素對當前元素的影響
right 清除右側浮動元素對當前元素的影響
both 清除兩側中最大影響的那側
定位（position）: 定位是一種更加高階的布局手段, 通過定位可以將元素擺放到頁面的任意位置, 使用position屬性來設定定位.
可選值：
相對定位：當元素的position屬性值設定為relative時則開啟了元素的相對定位.
元素開啟相對定位以後，如果不設定偏移量元素不會發生任何的變化
相對定位是參照於元素在文件流中的位置進行定位的
相對定位會提公升元素的層級
相對定位不會使元素脫離文件流
相對定位不會改變元素的性質塊還是塊，行內還是行內
定位元素垂直方向的位置由top和bottom兩個屬性來控制, 通常情況下我們只會使用其中乙個,top值越大，定位元素越向下移動,bottom值越大，定位元素越向上移動left: 定位元素和定位位置的左側距離
right: 定位元素和定位位置的右側距離
定位元素水平方向的位置由left和right兩個屬性控制,通常情況下只會使用乙個,left越大元素越靠右,right越大元素越靠左.絕對定位: 當元素的position屬性值設定為absolute時，則開啟了元素的絕對定位
開啟絕對定位後，如果不設定偏移量元素的位置不會發生變化
開啟絕對定位後，元素會從文件流中脫離
絕對定位會改變元素的性質，行內變成塊，塊的寬高被內容撐開
絕對定位會使元素提公升乙個層級
絕對定位元素是相對於其包含塊進行定位的
包含塊( containing block ): 正常情況下 包含塊就是離當前元素最近的祖先塊元素固定定位: 將元素的position屬性設定為fixed則開啟了元素的固定定位hello
.絕對定位的包含塊: 包含塊就是離它最近的開啟了定位的祖先元素，如果所有的祖先元素都沒有開啟定位則根元素就是它的包含塊, html（根元素、初始包含塊）
粘滯定位: 當元素的position屬性設定為sticky時則開啟了元素的粘滯定位
開啟了絕對定位的元素的布局
水平布局:
left + margin-left + border-left + padding-left + width + padding-right + border-right + margin-right + right = 包含塊的內容區的寬度
當我們開啟了絕對定位後: 水平方向的布局等式就需要新增left 和 right 兩個值, 此時規則和之前一樣只是多新增了兩個值：
當發生過度約束：
垂直方向布局的等式的也必須要滿足
top + margin-top/bottom + padding-top/bottom + border-top/bottom + height = 包含塊的高度
對於開啟了定位元素，可以通過z-index屬性來指定元素的層級
HTML 學習筆記（二）
這一節，主要學習了字型和網頁文字的排版，全是乾貨 一 奉上 my second htmltitle head bgcolor 7fffaa this text is bold b this text is strongstrong this text is bigbig this text is e...
HTML學習筆記（二）
只需要記住 h5文件型別 html的根元素，用來包含html文件的所有元素 包含在頭部的內容不會被顯示的頁面中，這裡通常包含頁面的編碼，作者，頁面的描述資訊，js的匯入，css的匯入等資訊。用來宣告當前文件的編碼方式為utf 8 utf 8 是一種字元編碼。如果你的網頁出現了中文，但是你卻沒有使用u...
HTML學習筆記B二
html基本結構的有關元素和元素屬性 head元素 1 之間的內容不會在瀏覽器的文件視窗顯示，但是其間的元素有特殊重要的意義。元素定義html文件的標題。與之間的內容將顯示在瀏覽器視窗的標題欄。head元素 2 元素 元素下面可以插入很多很有用的元素屬性。下面介紹四種 head元素 3 元素 用來標...