01文字域和select-option
select 元素可建立單選或多選選單。
元素中的
標籤用於定義列表中的可用選項。
02**1
**的基本構成元素最少需要三個 table tr td
**元素的彙總：
table：表示**
thead:表示標題行
tbody:表示**的主體
tfoot: 表示表腳
tr:表示一行單元格
th:表示標題行單元格 實際作用就是將內部的文字居中並且加粗
td:表示一列
col：表示一列
colgroup:一組列
caption 表示**標題
rowspan colspan合併行和和並列
03**2
細線**
border-collapse
:collapse;
**的外邊框
border
: 1px
solid
red;
標題的方位
caption-side
: bottom;
**的拉伸
table-layout
:auto;
空白的單元格不顯示 配合separate使用
empty-cells
: hide;
**的內邊框
table tr th ,table tr td
04css書寫方式
h1
選擇器
屬性名稱
屬性值
1.內聯樣式 dsadsadad
2.內部樣式表
3.外部樣式 在頭部通過link標籤引入css樣式表
優先順序：內聯樣式》內部樣式表》外部樣式
05css基本選擇器
* 萬用字元選擇器
p span div
標籤選擇器 頁面上所有同型別的標籤都會被作用到
.class
類選擇器通過具體的calss類名新增樣式乙個標籤可以擁有多個類名可以同時作用 #
id選擇器 id就像我們的身份證 唯一的 不能多個id同時作用
06組合選擇器
後代選擇器（以空格分隔） 包括兒子和孫子
子元素選擇器 （以大於號鏈結） 只認兒子
相鄰兄弟選擇器（以加號鏈結） 最近的那個兄弟
後續兄弟選擇器（以波浪線鏈結）
07盒子模型
margin(外邊距) - 清除邊框外的區域，外邊距是透明的。
border(邊框) - 圍繞在內邊距和內容外的邊框。
padding(內邊距) - 清除內容周圍的區域，內邊距是透明的。
content(內容) - 盒子的內容，顯示文字和影象。
08盒子模型誤區
你給普通的盒子新增border和padding 普通的盒子的寬度是會撐大的
如果你想保持普通的盒子的寬度不變 又能夠新增border和padding 就要給盒子新增box-sizing: border-box;
09float布局
float 屬性定義元素在哪個方向浮動
。浮動元素會生成乙個塊級框，而不論它本身是何種元素。
left
元素向左浮動。
right
元素向右浮動。
none
預設值。元素不浮動，並會顯示在其在文字中出現的位置。
inherit
規定應該從父元素繼承 float 屬性的值。
10導航條製作
display
: inline-block
;因為內聯元素 不支援寬高 不完全支援padding和marging方位 只有轉化成塊級元素才能支援 display:block；
11position-relative
1.標準流布局
2.浮動布局 float
3.定位布局 position
4.flex布局 彈性布局 彈性盒子
5.百分比布局
position
1.static :預設值 元素按照正常文件流排列
2.relative 相對定位 相對於上面最近的元素進行定位 元素仍然處於正常的文件流當中
使元素具有層級關係
position-absolute
position:
absolute 絕對定位
元素將會脫離正常的文件流 相對於可視視窗去定位
擁有層級關係 \
relative和absolute的根本區別:
relative屬性處於正常的文件流中相對於最近的元素的元素去定位
absolute屬性設定了就會脫離正常的文件流 相對於整個網頁定位確立定位的物件
13relative和absolute同時使用
如果父級元素使用了相對定位relative
子級用了這個絕對定位absolute 子元素會相對于父元素進行定位
14position-fixed
position:fixed 固定定位
脫離正常的文件流 相對於整個可視區域進行定位 擁有層級關係
最常見的地方：對聯廣告 登入彈窗 頂部導航條或者搜尋框
15position-inherit
position:inherit;繼承
兒子繼承老爸的定位元素
16z-index
z-index : 指定乙個元素的堆疊順序
只服務於有定位屬性的元素 position
z-index 大的元素會覆蓋z-index小的元素
z-index為auto的元素不參與層級比較（預設）
z-index為負值 元素就會別普通流中的元素覆蓋
z-index 遵循後來居上的原則 父元素的層級無論多大 子元素的層級無論多小都比父元素層級要高一點 加入了有z-index的父元素
，無論子元素的z-index多小 他都比父元素相鄰的兄弟元素的z-index要高
前端入門到熟悉day03
01為什麼要清除浮動 浮動會產生 高度塌陷 02偽元素選擇器 link a link 選擇所有未訪問鏈結 visited a visited 選擇所有訪問過的鏈結 active a active 選擇正在活動鏈結 hover a hover 把滑鼠放在鏈結上的狀態 focus input focus...
前端入門到熟悉day06
01屬性選擇器 屬性選擇器 屬性是相對於標籤而言的 所謂的屬性選擇器就是根據指定名稱的屬性的值來查詢頁面中的元素 1.e attr 查詢指定的擁有attr屬性的標籤 查詢擁有style屬性的標籤 li style 2.e attr value 查詢擁有指定的attr屬性並且這個屬性的值為value的...
前端入門到熟悉day18
陣列操作 array 陣列 物件方法 方法 描述 concat 連線兩個或更多的陣列，並返回結果。join 把陣列的所有元素放入乙個字串。元素通過指定的分隔符進行分隔。pop 刪除並返回陣列的最後乙個元素 push 向陣列的末尾新增乙個或更多元素，並返回新的長度。reverse 顛倒陣列中元素的順序...