常會用到display對應值有block、none、inline這三個值
參數:
block :塊對象的默認值。用該值爲對象之後添加新行。之前也添加一行。
none :隱藏對象。與visibility屬性的hidden值不同,其不爲被隱藏的對象保留其物理空間
inline :內聯對象的默認值。用該值將從對象中刪除行。如果其前後都是inline的則在同一行
display:block:
特點:
1、總是在新行上開始
2、該對象隨後的內容自動換行
3、高度,行高以及頂和底邊距都可控制
4、如果寬度缺省,則默認爲它容器的100%
作用:
1. 顯示被隱藏的塊級元素,一般是相對於diplay:none;使用的。
2. 定義非塊級元素,使css定義的長寬生效,比較常用於a、span這兩個標籤。
display:none;
用於隱藏對象內容,被隱藏的對象也不會佔用自身固有寬度高度空間。
例如在導航條的二級菜單中就會使用此屬性顯示和隱藏二級菜單。
display:inline;
功能:
常在li中使用,讓li排成一排。
特點:
和其他元素都在一行上
高,行高及頂和底邊距不可改變
寬度就是它的文字或圖片的寬度,不可改變
附:
常見的塊級元素
* address - 地址
* blockquote - 塊引用
* center - 舉中對齊塊
* dir - 目錄列表
* div - 常用塊級容易,也是css layout的主要標籤
* dl - 定義列表
* fieldset - form控制組
* form - 交互表單
* h1 - 大標題
* h2 - 副標題
* h3 - 3級標題
* h4 - 4級標題
* h5 - 5級標題
* h6 - 6級標題
* hr - 水平分隔線
* isindex - input prompt
* menu - 菜單列表
* noframes - frames可選內容,(對於不支持frame的瀏覽器顯示此區塊內容
* noscript - )可選腳本內容(對於不支持script的瀏覽器顯示此內容)
* ol - 排序表單
* p - 段落
* pre - 格式化文本
* table - 表格
* ul - 非排序列表
常見的非塊級元素
* a - 錨點
* abbr - 縮寫
* acronym - 首字
* b - 粗體(不推薦)
* bdo - bidi override
* big - 大字體
* br - 換行
* cite - 引用
* code - 計算機代碼(在引用源碼的時候需要)
* dfn - 定義字段
* em - 強調
* font - 字體設定(不推薦)
* i - 斜體
* img - 圖片
* input - 輸入框
* kbd - 定義鍵盤文本
* label - 表格標籤
* q - 短引用
* s - 中劃線(不推薦)
* samp - 定義範例計算機代碼
* select - 項目選擇
* small - 小字體文本
* span - 常用內聯容器,定義文本內區塊
* strike - 中劃線
* strong - 粗體強調
* sub - 下標
* sup - 上標
* textarea - 多行文本輸入框
* tt - 電傳文本
* u - 下劃線
* var - 定義變量