復合選擇器是建立在基礎選擇器之上,對基礎選擇器進行組合形成的。
復合選擇器可以更準確更高效的選擇目標標籤
復合選擇器是由兩個或多個基礎選擇器,通過不同方式組合而成的
常用的復合選擇器為:後代選擇器 子選擇器 並集選擇器 偽類選擇器
後選擇器又稱為 包含選擇器
後選擇器可以選擇父元素裡面子元素
標籤1和標籤2 中間一定要空格隔開
標籤1必須是父級,標籤2是子級,最終選擇的是標籤2
ol>li
可以把ol裡面li選出來
一般情況下,後代選擇器盡量不要超過4層
(親兒子選擇器) 選擇某個元素最近一級的子元素 **親兒子**
子代選擇器最終選中的元素是子代標籤→親兒子
子代選擇器的選擇器之間使用( >) 分開(div>a)
可以選擇多組標籤,同時為他們定義相同的樣式
並集選擇器是通過(,)逗號連線而成,逗號可以理解為(和)的意思。
可以任何形式的選擇器連線
( 並集選擇器喜歡豎著寫 )
最後乙個選擇器不需要加逗號
偽類選擇器使用單冒號(是某種狀態)
針對鏈結不同狀態設定不同的樣式
只在標籤 a 使用
書寫順序:link-visited-hover-active
元素(標籤) 以什麼方式進行顯示
html一般由兩種顯示模式
分為(塊元素)和(行內元素)
塊元素:
獨佔一行
高度寬度外邊距可以設定
寬度預設是容器的100%
是乙個容器或盒子,裡面可以放行內或者塊級元素
文字類的元素不能使用塊級元素
p標籤主要用於存放文字 不能放塊級元素,特別是不能放 div
同理 h1-h6 都是文字類塊級標籤 也不可以
行內元素
相鄰行內元素在一行上,一行可以顯示多個
高、寬直接設定是無效的
預設寬度就是它本身內容的寬度
行內元素只能容納文字或其他行內元素
(鏈結裡面不能再放鏈結 )
(特殊情況鏈結行內塊元素
同時具有塊元素和行內元素的特點被稱為行內塊元素
和相鄰行內元素(行內塊)在一行上,但是他們之間會有空白縫隙。
一行可以顯示多個(行內元素特點)。
預設寬度就是它本身內容的寬度(行內元素特點)。
高度,行高、外邊距以及內邊距都可以控制(塊級元素特點)。
display:block 轉換為塊元素
display:inline 轉換為行內元素(使用較少)
display:inline-block 轉換為行內塊元素
line-height 行高=高=實現垂直居中 (單行)
背景
常見於logo或者裝飾小或超大
便於控制位置
backround-image: url
backround-repeat:repeat(預設平鋪)
repeat 預設,平鋪
no-repeat 不平鋪
repeat-x 水平平鋪
repeat-y 垂直平鋪
背景位置
backround-position
x座標和y座標 可以使用方位名詞或者精確單位
背景影象固定
backround-attachment
transparent 透明的
background-color:rgba(0,0,0,)
背景色半透明 rgba 不影響盒子裡面的內容
盒子半透明 opacity 是整個盒子裡內容半透明
CSS階段第二天
10月29日內容 一 css選擇器 css找到html標籤的方法,叫做選擇器 1.基本選擇器 2.層級選擇器 3.屬性選擇器 4.偽類選擇器 5.其它選擇器 二 詳解選擇器 一 基本選擇器 1.id選擇器 在需要操作的標籤中,加入id 值 名 屬性 在css中通過 值 名 選擇html標籤 ps 不...
慢慢說CSS第二天
今天想說三件事 第一,迪普拉斯的麵包很好吃 第二,咳咳,關於css,不用也可以做出美美的效果 第三,善用利用不同的標籤 從第二點開始說 我很自覺 css的border image和border radius屬性很有用,但是ie並不支援border image,囧囧噠。而且border radius也...
上班第二天
本想坐晚一班車的,誰知道這晚一班的也只是晚了 五 六分鐘,不高興再在站台上等,也只好小跑到車門上去了,果然,八點十分就到了。白天那個困啊 今天的工作內容和昨天一樣,做到後來我實在覺得測的差不多了,想幹些其他的,但這初來乍到的,也不好幹其他的呀,況且領導辦公室就在我旁邊。今天的工作總結有兩點 1 別把...