第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

1、陰影模糊半徑和陰影擴(kuò)展半徑的區(qū)別

? ? 陰影模糊半徑：可選，只能為正值。

? ? 陰影擴(kuò)展半徑：可選。值為正，整個陰影都擴(kuò)大；值為負(fù)，則縮小。

2、X軸偏移量和Y軸偏移量如果設(shè)置為負(fù)數(shù)，向反方向發(fā)散陰影。

box-shadow:?X軸偏移量?Y軸偏移量?[陰影模糊半徑]?[陰影擴(kuò)展半徑]?[陰影顏色]?[投影方式];

1、inset必須寫在參數(shù)的第一個或最后一個。

2、添加多個陰影時，只需要用逗號隔開。如：? ? ?

.box_shadow{
????box-shadow:4px?2px?6px?#f00,?-4px?-2px?6px?#000,?0px?0px?12px?5px?#33CC00?inset;
}

b本章節(jié)筆記

d本章節(jié)的代碼

b背景的大小

裁剪方式背景

本節(jié)重點(diǎn)的

參考案例截圖

本章節(jié)重點(diǎn)

漸變背景的筆記

CSS3 結(jié)構(gòu)性偽類選擇器—last-child

“:last-child”選擇器與“:first-child”選擇器作用類似，不同的是“:last-child”選擇器選擇的是元素的最后一個子元素。例如，需要改變的是列表中的最后一個“l(fā)i”的背景色，就可以使用這個選擇器，

ul>li:last-child{background:blue;}

示例演示

在博客的排版中，每個段落都有15px的margin-bottom，假設(shè)不想讓博客“post”中最后一個段落不需要底部的margin值，可以使用“:last-child”選擇器。

HTML代碼：

<div?class="post">???<p>第一段落</p>???<p>第二段落</p>???<p>第三段落</p>???<p>第四段落</p>???<p>第五段落</p>?</div>

CSS代碼：

.post?{???padding:?10px;???border:?1px?solid?#ccc;???width:?200px;???margin:?20px?auto;?}?.post?p?{???margin:0?0?15px?0;?}?.post?p:last-child?{???margin-bottom:0;
?}
?演示結(jié)果：

• transition-property:指定過渡或動態(tài)模擬的CSS屬性

• transition-duration:指定完成過渡所需的時間

• transition-timing-function:指定過渡函數(shù)

• transition-delay:指定開始出現(xiàn)

• 的延遲時間

CSS3 結(jié)構(gòu)性偽類選擇器—first-child

“:first-child”選擇器表示的是選擇父元素的第一個子元素的元素E。簡單點(diǎn)理解就是選擇元素中的第一個子元素，記住是子元素，而不是后代元素。

示例演示

通過“:first-child”選擇器定位列表中的第一個列表項(xiàng)，并將序列號顏色變?yōu)榧t色。

HTML代碼：

<ol>???<li><a?href="##">Link1</a></li>???<li><a?href="##">Link2</a></li>???<li><a?href="##">link3</a></li>?</ol>

CSS代碼：

ol?>?li{???font-size:20px;???font-weight:?bold;???margin-bottom:?10px;?}?ol?a?{???font-size:?16px;???font-weight:?normal;?}?ol?>?li:first-child{???color:?red;
?}
?演示結(jié)果：

CSS3 結(jié)構(gòu)性偽類選擇器—target

:target選擇器稱為目標(biāo)選擇器，用來匹配文檔(頁面)的url的某個標(biāo)志符的目標(biāo)元素。我們先來上個例子，然后再做分析。

示例展示

點(diǎn)擊鏈接顯示隱藏的段落。

HTML代碼：

<h2><a?href="#brand">Brand</a></h2>?<div?class="menuSection"?id="brand">?????content?for?Brand?</div>

CSS代碼：

.menuSection{???display:?none;?}?:target{/*這里的:target就是指id="brand"的div對象*/???display:block;?}

演示結(jié)果：

分析：

1、具體來說，觸發(fā)元素的URL中的標(biāo)志符通常會包含一個#號，后面帶有一個標(biāo)志符名稱，上面代碼中是：#brand

2、：target就是用來匹配id為“brand”的元素（id="brand"的元素）,上面代碼中是那個div元素。

多個url（多個target）處理：

就像上面的例子，#brand與后面的id="brand"是對應(yīng)的，當(dāng)同一個頁面上有很多的url的時候你可以取不同的名字，只要#號后對的名稱與id=""中的名稱對應(yīng)就可以了。
如下面例子：
html代碼： ?

<h2><a?href="#brand">Brand</a></h2>?<div?class="menuSection"?id="brand">???content?for?Brand?</div>?<h2><a?href="#jake">Brand</a></h2>?<div?class="menuSection"?id="jake">??content?for?jake?</div>?<h2><a?href="#aron">Brand</a></h2>?<div?class="menuSection"?id="aron">?????content?for?aron?</div>

css代碼：

#brand:target?{???background:?orange;???color:?#fff;?}?#jake:target?{???background:?blue;???color:?#fff;?}?#aron:target?{???background:?red;???color:?#fff;?}

CSS3 結(jié)構(gòu)性偽類選擇器—empty

:empty選擇器表示的就是空。用來選擇沒有任何內(nèi)容的元素，這里沒有內(nèi)容指的是一點(diǎn)內(nèi)容都沒有，哪怕是一個空格。

示例顯示：

比如說，你的文檔中有三個段落p元素，你想把沒有任何內(nèi)容的P元素隱藏起來。我們就可以使用“:empty”選擇器來控制。

HTML代碼：

<p>我是一個段落</p>
<p>?</p>
<p></p>

CSS代碼：

p{
?background:?orange;
?min-height:?30px;
}
p:empty?{
??display:?none;
}
演示結(jié)果：