上傳人：y***

認(rèn)證信息

認(rèn)證類型：個(gè)人認(rèn)證

認(rèn)證主體：孫**（實(shí)名認(rèn)證）

IP屬地：山東

IP屬地：山東 上傳時(shí)間：2025-05-27 格式：PPTX 頁(yè)數(shù)：15 大?。?1.68MB 積分：6 舉報(bào) 版權(quán)申訴

CSS3新增屬性信息安全技術(shù)應(yīng)用ApplicationofInformationSecurityTechnology《前端技術(shù)開發(fā)》前端技術(shù)開發(fā)知識(shí)儲(chǔ)備邊框圓角設(shè)置1元素陰影設(shè)置201邊框圓角設(shè)置前端技術(shù)開發(fā)01邊框圓角屬性CSS3提供了創(chuàng)建圓角邊框的屬性,語(yǔ)法如下：border-*-*-radius：length|%length|%使用CSS3屬性需要注意瀏覽器兼容性問(wèn)題說(shuō)明：

border-*-*-radius中第1個(gè)“*”用top或bottom，第2個(gè)“*”使用left或right來(lái)表示邊框圓角位置。

使用1-2個(gè)值來(lái)設(shè)置水平方向(X軸)和垂直方向(Y軸)的值，長(zhǎng)度或百分比來(lái)表示01邊框圓角屬性CSS3設(shè)置邊框圓角的屬性：屬性描述border-radius每個(gè)分量可取1-4個(gè)值border-top-left-radius定義了左上角的弧度，1-2個(gè)值border-top-right-radius定義了右上角的弧度，1-2個(gè)值border-bottom-right-radius定義了右下角的弧度，1-2個(gè)值border-bottom-left-radius定義了左下角的弧度，1-2個(gè)值01邊框圓角屬性設(shè)置1個(gè)值，即一個(gè)正圓設(shè)置兩個(gè)不相等的值，則是一個(gè)橢圓?？偨Y(jié)：每個(gè)角可以使用X軸、Y軸上的兩個(gè)值表示，相等時(shí)，可使用一個(gè)值表示。border-top-left-radius：15px;圓角設(shè)置一個(gè)值：圓border-top-left-radius：20px15px;圓角設(shè)置兩個(gè)值：橢圓01邊框圓角屬性border-radius：length|%

/length|%設(shè)置圓角邊框綜合屬性,語(yǔ)法如下：說(shuō)明：

第一個(gè)分量可以使用1-4個(gè)值表示水平方向(X軸)上四個(gè)角的設(shè)置，長(zhǎng)度或百分比來(lái)表示。

第二個(gè)分量可以使用1-4個(gè)值表示垂直方向(Y軸)上四個(gè)角的設(shè)置，長(zhǎng)度或百分比來(lái)表示。01邊框圓角屬性border-radius:25px;border-radius:15px50px30px;border-radius:15px50px;border-radius:

15px50px30px5px;同時(shí)設(shè)置4個(gè)角1個(gè)值第1個(gè)值為左上和右下第2個(gè)值為右上與左下2個(gè)值第1個(gè)值為左上角第2個(gè)值為右上和左下第3個(gè)值為右下角3個(gè)值第1個(gè)值為左上角第2個(gè)值為右上角第3個(gè)值為右下角第4個(gè)值為左下角4個(gè)值01邊框圓角屬性border-radius:50%;用法一：如何將網(wǎng)頁(yè)元素設(shè)置為圓形？

圓角半徑為元素長(zhǎng)度的50%，該元素顯示為圓形用法二：簡(jiǎn)寫方式border-radius:4px3px6px/2px

4px;border-top-left-radius:4px2px;border-top-right-radius:3px4px;border-bottom-right-radius:6px2px;border-bottom-left-radius:3px4px;X軸：3個(gè)值表示Y軸：2個(gè)值表示前端技術(shù)開發(fā)02元素陰影設(shè)置邊框陰影設(shè)置前端技術(shù)開發(fā)02box-shadow：x-offsety-offsetblurspreadcolorstyle;CSS3提供了設(shè)置邊框陰影的屬性，語(yǔ)法如下：說(shuō)明：

x-offset：定義水平陰影的偏移距離，可以使用負(fù)值。

y-offset：定義垂直陰影的偏移距離，可以使用負(fù)值。blur：定義陰影的模糊半徑，只能為正值。spread：定義陰影的大小。color：定義陰影的顏色。style：定義是外陰影還是內(nèi)陰影。outset（默認(rèn)值）表示外陰影；inset表示內(nèi)陰影。邊框陰影設(shè)置前端技術(shù)開發(fā)02box-shadow屬性為4個(gè)方向的邊框定義獨(dú)立的陰影效果。selector{box-shadow:-5px012pxred,/*左陰影*/

0-5px12pxyellow,/*上陰影*/

05px12pxblue,/*下陰影*/

5px012pxgreen;/*右陰影*/}其中每條邊的陰影屬性值之間用英文逗號(hào)隔開。-5px-5px邊框陰影設(shè)置前端技術(shù)開發(fā)02box-shadow屬性設(shè)置邊框陰影效果實(shí)例：外陰影box-shadow:0010px#000;右下陰影box-shadow:2px2px5px#000;內(nèi)陰影box-shadow:inset0px0px5px1px#000;1234透明陰影box-shadow:12px12px2px1pxrgba(0,0,255,.1);04總結(jié)CSS3設(shè)置圓角屬性如下：CSS3設(shè)置邊框陰影屬性如下：box-s