一、元素展示型別
html中本身定義許多元素有自己預設在網頁中顯示的樣式,如有些元素預設情況下,你設定的寬高屬性不起作用,有些元素獨佔一行。這種現象我們稱為元素展示型別,為了方便記憶將元素展現型別分為三種:1.塊元素 2.行內元素 3.行內塊元素
塊元素:當時存在多個塊元素時,每乙個塊元素都會獨佔一行,且預設情況的寬高屬性可以顯示。
行內元素:當多個行內元素時,這些元素會在一行顯示,如果放不下就會自動換行放置。預設情況下寬高屬性不起作用。
行內塊元素:當存在多個塊元素的時候,這些元素會顯示在一行,預設情況下寬高屬性起作用。
二、布局標籤補充
div標籤,它是html中定義好的雙標籤(div+css)。div是乙個體積最大的標籤。
span標籤,它是乙個雙標籤,主要用來放文字,體積小。
段落標籤不能巢狀標題標籤,瀏覽器無法正常解析。
三、元素展示型別轉換
當在網頁布局中,若需要標籤展示特定形式,那麼我們可以通過display強制轉換型別來達成目的。
轉成塊內元素:display:block;
轉成行內塊元素:display:inline-block
轉成行內元素:display:inline;
不顯示:display:none
四、簡單選擇器權重
權重可認為是優先順序,對於簡單選擇器來說其優先順序都不一樣。
優先順序:
id選擇器》類名選擇器》標籤選擇器
特性:1.在優先順序一樣的時候,同乙個元素後寫的css樣式會覆蓋掉先寫的css樣式
2. css的定義存在繼承特點,即子元素會繼承父元素的一些樣式
注:不是所有css屬性都可繼承,不是所有型別的元素都會繼承父(祖)元素的樣式(一般發生在塊元素上)
3. 不同選擇器對相同元素的控制能力不同,優先順序越高,先控制,優先順序低無作用。
五、復合選擇器
在多層巢狀中,通常我們需要使用復合選擇器,使我們簡單的從一堆元素中選取乙個或者多個元素進行樣式設定。
1.後代選擇器:以某一元素為起點,向後查詢,去選擇他的後代元素。
樣式:起點元素 後代元素 …
例子:
div p span
以輩分理解div為爺爺輩,p為父輩,span為子輩
注:(1).復合選擇器中的每一部分都可用任意簡單選擇器代替。以上面**舉個例子:在div中設定了class型別後,可以用.類名來代替div。
(2).不同部分之間用空格隔開。
2.並列選擇器:就是講多個選擇器用都厚連線,表示同時選擇這些元素,設定相同樣式,其中每乙個選擇器都可以由任意型別選擇器構成。
樣式:元素1,元素2,元素3,…
例子:
h4,p,a
六、選擇器權重總結
1.優先順序:
id選擇器》類名選擇器》標籤選擇器
2.復合選擇器:在復合選擇器中人為設定權重值,以區分不通選擇器對同乙個元素的控制力。
id選擇器 100
類選擇器 10
標籤 1
注:對於復合選擇器來說,復合選擇器相加的權重值越大,對元素控制力越強,但要注意的是僅在復合權重中適用。
軟體測試 學習之路 CSS 四
一 文字樣式中階 字型樣式 格式 font 文字粗細 大小 行高 字型名稱 例子 font bold 200px 400px 微軟雅黑 2.字型陰影 格式 text shadow x y r color 注 x是為負數則陰影向左,整數向右,同理y正數向上,負數向下,r代表陰影模糊程度,數值月大則越模...
軟體測試 學習之路 linux基礎命令 (二)
一 linux基礎命令高階 1.重定向 例子 ls 1.txt把命令返回結果輸出到檔案中,會覆蓋之前的資料 ls 1.txt把命令返回結果輸出到檔案中,不覆蓋之前的資料 2.檢視檔案內容 cat 例子 cat 1.txt把檔案內容顯示出來 cat 1.txt 2.txt 檢視多個檔案內容並按順序顯示...
軟體測試的學習之路 軟體質量
為什麼需要軟體測試 1 一款軟體從無到有會經歷很多的開發階段由不同的人來參與開發,所以最終產出的軟體功能可能會存在問題。因此為了保證軟體的功能是可用的,我們必須要進行測試。2 當前的軟體件行業已經不在是功能為王了,不僅僅只盯著軟體的功能是否滿足需求,還會對軟體是否容易上手,執行效率是否 ok 等一系...