H5中attr屬性的使用,偽元素,陰影

2021-08-28 10:22:32 字數 861 閱讀 7889

e[attr=value]:查詢擁有指定的attr屬性並且屬性值為value的e標籤。如想查詢擁有class屬性並且值為red的li標籤 就是嚴格匹配。

e[attr*=value]:查詢擁有指定的attr屬性並且屬性值中包含(可以在任意位置)value的e標籤。

e[attr^=value]:查詢擁有指定的attr屬性並且屬性值以value開頭的e標籤。

e[attr$=value]:查詢擁有指定的attr屬性並且屬性值以value開結束的e標籤。

兄弟偽類:

+:獲取當前元素的相鄰的滿足條件的元素

~:獲取當前元素的滿足條件的兄弟元素

e:target:可以為錨點目標元素新增樣式,當目標元素被觸發為當前錨鏈結的目標時,呼叫此偽類樣式。

例如:

h2:target
偽元素:::before ::after

/*必須新增content屬性,否則後期不可見*/

content: "";

/*預設是行級元素,如果想設定寬高,就必須轉換為塊級元素*/

position: absolute;

通過opacity設定透明度:如果設定父容器,那麼父容器中的所有子元素也會透明

文字陰影:text-shadow:offsetx offsety blur color

邊框陰影:box-shadow:h v blur spread color inset

h:水平方向的偏移值

v:垂直方向的偏移值

blur:模糊--可選,預設0

spread:陰影的尺寸,擴充套件和收**影的大小--可選 預設0

color:顏色--可選,預設黑色

inset:內陰影--可選,預設是外陰影

h5 其他偽元素

1 doctype html 2 html lang en 3 head 4 meta charset utf 8 5 title title title 6 style 7 獲取第乙個字元 實現首字下沉 8 p first letter 1314 獲取第一行內容 如果設定了 first lette...

H5的頁面元素

details語義 詳情 summary語義 概要,摘要 details元素可以實現類似顯示 隱藏的功能,summary用於顯示details的標題或者間接 注意 1 如果details下面沒有summary元素,瀏覽器會自動新增,同時內容是 詳細資訊 2 details預設是關閉狀態的,我們可以通...

H5常用的標籤元素

常用html標籤元素結合及簡介 建立乙個html文件 設定文件標題和其它在網頁中不顯示的資訊 設定文件的標題 最大的標題 預先格式化文字 下劃線黑體字 斜體字 打字機風格的字型 引用,通常是斜體 強調文字 通常是斜體加黑體 加重文字 通常是斜體加黑體 設定字型大小從1到7,顏色使用名字或rgb的十六...