HTML和CSS學習筆記第15章 其他

2021-10-08 12:41:27 字數 1003 閱讀 1815

返回主目錄

開發商特定css屬性

css變換和過渡

偽元素可以用來選擇元素的某些部分。例如first-letter可以選擇乙個塊元素文字的第乙個字幕,這樣就能建立諸如首字母大寫或首字母下沉等效果。first-line則能選擇段落第一行。

語法與偽類相同:

p:first-letter

根據屬性值選擇元素:

img[width]

img[height="300"]

image[alt~="flowers"]

假設你希望只選擇前面有乙個語法:

開頭兩個短橫線,兩橫線之間是開發商識別符號的縮寫,後接屬性:

-moz-transform	//這裡是開發商mozilla的縮寫
div

>

>

charset

="utf-8"

>

>

css transforms and transitionstitle

>

>

#box

#box:hover

style

>

head

>

>

"box"

>

div>

body

>

html

>

輸入以上**會使乙個正方形旋轉45度成為菱形。但不平滑旋轉。

可以為box增加transition屬性,讓它在2秒內變換到新狀態。

#box

transition屬性的值也是乙個屬性,在這裡使transform,另外還有個持續時間,即2秒。transition會使這個變化在指定時間內完成,這就產生了一種動畫效果。

html和css學習筆記(二)

cellspacing 單元格邊框和單元格邊框之間的距離 cellpadding 單元格內容與單元格邊框之間的距離 三參為0 border cellspacing cellpadding 一般都為0,預設cellspacing cellpadding有值 catption,必須緊隨table標籤之後...

HTML和CSS的學習筆記(二)

1.製作網頁寫 時,習慣給它安乙個固定框架,便於以後查詢修改,例如,整個網頁給它乙個div wrap 給網頁標頭欄乙個div header 然後是內容div mainbody.最後是footer.因為之前在學習時沒有規範的寫法,所以讓自己碰到了很多麻煩,使 很亂。這樣簡單地分類,可以利於自己以後的修...

html與css學習筆記

定位之absolute和relative 一般設定了absolute或relative時,才設定right left left 50px 意思是左邊線距離定位盒子的左邊線50px 一般父盒子設定了position absolute display inline block float left ri...