11.1筆記
1、window.onload()方法用於在網頁載入完畢後立刻執行的操作，即當 HTML 文件載入完畢後，立刻執行某個方法。通常用於 <body> 元素，在頁面完全載入後(包括圖片、css檔案等等)執行指令碼程式碼。
widow.onload()與jQuery ready()兩種方式都是在 HTML 文件完畢後再執行 DOM 操作，但它們還是有一定的區別，以下為兩者的區別的區別：
2、<a> 標籤的 target 屬性：規定在何處開啟連結文件。幾種屬性值：
target：-blank：在一個新的視窗開啟被連結的文件。
target：-parent：在父框架集中開啟被連結文件。
target：-top：在整個視窗中開啟被連結文件。
target：framename：在指定的框架中開啟被連結文件。
3、css樣式對於input下多個輸入框如何進行選擇：
例如：對於文字輸入框的選擇為：input[type=text]
4、display：flex;以為彈性佈局，可以為盒裝模型提供很大的靈活性。
flex的六種屬性：1、flex-direction 容器內元素的排列方向(預設橫向排列)，其中有三種排列方式：
a、flex-direction:row; 沿水平主軸讓元素從左向右排列
a b c
b、flex-direction:column; 讓元素沿垂直主軸從上到下垂直排列
c、flex-direction:row-reverse;沿水平主軸讓元素從右向左排列
2、flex-wrap容器內元素的換行
a、flex-wrap:nowrap：(預設)元素不換行，比如一個div的寬度為100%。設定此屬性，2個div寬度自動變為50%。
b、flex-wrap:wrap：元素換行，比如一個div的寬度為100%。設定此屬性，第二個div就在第二行了。
3、justify-content元素在主軸(頁面)上的排列
a、justify-content : center;元素在主軸（頁面）上居中排列
a b c
b、justify-content : flex-start;元素在主軸（頁面）上由左或者上開始排列
c、justify-content : flex-end;元素在主軸（頁面）上由右或者下開始排列
d、justify-content : space-between;元素在主軸（頁面）上左右兩端或者上下兩端開始排列
d e
e、justify-content : space-around;每個元素兩側的間隔相等。所以，元素之間的間隔比元素與邊框的間隔大一倍。
4、felx-flow：flex-direction屬性和flex-wrap屬性的簡寫形式，預設值為row nowrap。
5、align-items 元素在主軸（頁面）當前行的橫軸（縱軸）方向上的對齊方式
a、align-items : flex-start; 彈性盒子元素的側軸（縱軸）起始位置的邊界緊靠住該行的側軸起始邊界（靠上對齊）。
a b c
b、align-items : flex-end; 彈性盒子元素的側軸（縱軸）起始位置的邊界緊靠住該行的側軸結束邊界。（靠下對齊）
c、align-items : center; 彈性盒子元素在該行的側軸（縱軸）上居中放置。（居中對齊）。 6、align-content 在彈性容器內的元素沒有佔用交叉軸上所有可用的空間時對齊容器內的各項（垂直）。 a b c d e fa、align-content: flex-start; 元素位於容器的開頭。各行向彈性盒容器的起始位置堆疊
b、align-content: flex-end; 元素位於容器的結尾。各行向彈性盒容器的結尾位置堆疊。
c、align-content: stretch; 元素位於容器的中心。各行向彈性盒容器的中間位置堆疊。d、align-content: center; 預設值。元素被拉伸以適應容器。各行將會伸展以佔用剩餘的空間。如果剩餘的空間是負數，該值等效於'flex-start'
e、:align-content: space-between;元素位於各行之間留有空白的容器內。各行在彈性盒容器中平均分佈。f、align-content: space-around;元素位於各行之前、之間、之後都留有空白的容器內。各行在彈性盒容器中平均分佈，兩端保留子元素與子元素之間間距大小的一半。如果剩餘的空間是負數或彈性盒容器中只有一行，該值等效於'center'。
5、document.querySelector(".title");//獲取文件中class為title的元素。
querySelector() 方法返回文件中匹配指定 CSS 選擇器的一個元素。