第七章
1.網頁布局
標準文件流
指元素根據塊元素或行內元素的特性按從上到下,從左到右的方式自然排列。這也是元素預設的排列方式
標準文件流組成
塊級元素(block)
<h1>…<h6>、<p>、<div>、列表
內聯元素(inline)
<span>、<a>、<img/>、<strong>…
2.display屬性值說明
block
塊級元素的預設值,元素會被顯示為塊級元素,該元素前後會帶有換行符
inline
內聯元素的預設值。元素會被顯示為內聯元素,該元素前後沒有換行符
inline-block
行內塊元素,元素既具有內聯元素的特性,也具有塊元素的特性
none
設定元素不會被顯示
3.浮動(float)屬性
值 說明
left
左浮動right
右浮動none
不浮動4.清除浮動
clear屬性值說明
left
在左側不允許浮動元素
right
在右側不允許浮動元素
both
在左、右兩側不允許浮動元素
none
預設值。允許浮動元素出現在兩側
解決父級邊框塌陷的方法
浮動元素後面加空div
浮動的盒子……
.clear
設定父元素的高度
浮動的盒子……
#father
父級新增overflow屬性
浮動的盒子……
#father
overflow屬性
屬性值說明
visible
預設值。內容不會被修剪,會呈現在盒子之外
hidden
內容會被修剪,並且其餘內容是不可見的
scroll
內容會被修剪,但是瀏覽器會顯示滾動條以便檢視其餘內容
auto
如果內容被修剪,則瀏覽器會顯示滾動條以便檢視其餘的內容
父級新增偽類after
浮動的盒子……
.clear:after
解決父級邊框塌陷的方法的優缺點
浮動元素後面加空div
簡單,空div會造成html**冗餘
設定父元素的高度
簡單,元素固定高會降低擴充套件性
父級新增overflow屬性
簡單,下拉列表框的場景不能用
父級新增偽類after
寫法比上面稍微複雜一點,但是沒有***,推薦使用
5.inline-block和float的區別
display:inline-block
可以讓元素排在一行,並且支援寬度和高度,**實現起來方便
位置方向不可控制,會解析空格
ie 6、ie 7上不支援
float
可以讓元素排在一行並且支援寬度和高度,可以決定排列方向
float 浮動以後元素脫離文件流,會對周圍元素產生影響,必須在它的父級上新增清除浮動的樣式
假期作業3
第三章 1.dom操作 訪問節點 使用getelement系列方法訪問指定節點 getelementbyid getelementsbyname getelementsbytagname 根據層次關係訪問節點 節點屬性 屬性名稱 描述parentnode 返回節點的父節點 childnodes 返回...
假期作業8
第八章 1.樣式操作 css 獲取和設定樣式 addclass 追加樣式 removeclass 移除樣式 toggleclass 切換樣式 2.內容操作 html 操作 text 內容操作 val 屬性值操作 3.節點操作 查詢節點 建立節點元素 插入節點 刪除節點 替換節點 複製節點 4.屬性操...
假期作業9
第九章 1.表單基本驗證技術 減輕伺服器的壓力 保證輸入的資料符合要求 2.表單選擇器 語法描述 示例 input 匹配所有input textarea select和button 元素 myform input 選取表單中所有的input select和button元素 text 匹配所有單行文字...