前端2 字型 文字屬性樣式, 高階選擇器

2022-05-05 01:00:07 字數 1313 閱讀 9472

字型設定:

text-align:center

color:red

font:900 30px/120px "stsong" "微軟雅黑" (備用字族)字重 大小/行高 字族

字劃線:

text-decoration:underline|line-through|overline

盒子水平居中:

margin: 0 auto;

margin-left:auto;#自動匹配到最左

reset操作

大多數系統預定義標籤,有預設樣式,不滿足實際開發需求,反倒影響布局,

通常在開發前,將需要用到的預定義標籤的預設樣式清除,該操作就稱之為reset操作

body,h1,h2,h3 pula

高階選擇器:

1,群組

div,p,a{}

2.後代,子代

body div{}空格隔開,子代的子代還是後代

body>div{} 大於號,只能控制子代

3.兄弟,相鄰

.div1~.div2{}兄弟

.div1+.div2{}相鄰

4.位置

li:nth-child(2n){}

li:not(:frist-child) a{}

5.多類,乙個標籤有多個名字 class=" 大名 小名"

.大名.小名{}

高階選擇器優先順序

優先順序和個數(權重)相關

基礎選擇器優先順序佔主導:id無限》class>標籤

選擇器優先順序相同時和順序有關

高階選擇器型別不會影響優先順序

偽類選擇器相當於乙個類名

邊角圓角

左上為第乙個角

border-radius:30px 60px;第乙個角30,30 第二個角60,60 第三個跟第一一樣,第四個跟第二一樣

border-radius:50%圓

border-radius :50px 10px / 150px x軸y軸分離,y軸都是150px

a 的四大偽類

:link(未有連線過的狀態,連線初始狀態)

:hover滑鼠懸浮狀態

:visited 訪問過以後的狀態

:active 滑鼠按下時的狀態

div可以用的兩個狀態,hover active即跟連線沒有關係的兩個狀態

預設的背景左上角和標籤的左上角重合

通過調整位置讓標籤顯示想要顯示的圖案

精靈圖控制本質:控制背景的位置

background-position-x

background-position-y

div:hover{}

前端 文字屬性和字型屬性

介紹幾個常用的。文字對齊 text align 屬性規定元素中的文字的水平對齊方式。屬性值 none center left right justify 文字顏色 color屬性 文字首行縮排 text indent 屬性規定元素首行縮排的距離,單位建議使用em 文字修飾 text decorati...

前端CSS3 字型樣式

一 font family設定字型 sans serif是專指西文中沒有襯線的字型 例如 為網頁中的文字設定字型為 宋體 text css body 或body style 二 font size設定字型大小 例如 設定網頁中文字的字型大小為12畫素。text css body style 三 fo...

黑馬前端 CSS基礎 CSS 字型屬性 文字屬性

內容來自b站的黑馬程式設計師pink老師 由我收集整理 css fonts 字型 屬性用於定義字型系列 大小 粗細 和文字樣式 如斜體 css 使用 font family 屬性定義文字的字型系列 p div 各種字型之間必須使用英文狀態下的逗號隔開 一般情況下,如果有空格隔開的多個單詞組成的字型,...