CSS 邊框?qū)傩杂糜诙x元素的邊框?qū)傩浴Ｋ沁吙驅(qū)挾取⑦吙驑邮胶瓦吙蝾伾暮唽憽？梢詫?duì)各個(gè)邊的邊框進(jìn)行樣式設(shè)置，也可以指定邊框半徑。
另一方面，CSS 輪廓不占用空間，并且如果設(shè)置，則顯示在邊框周圍。它支持偏移。此外，我們無法指定各個(gè)邊是否應(yīng)該有輪廓。
默認(rèn)情況下，不會(huì)顯示邊框和輪廓。
語法
CSS 邊框和輪廓屬性的語法如下 –
Selector {
border: /*value*/
outline: /*value*/
}
登錄后復(fù)制
示例
以下示例說明了 CSS 邊框和輪廓屬性 –
?實(shí)時(shí)演示
<!DOCTYPE html>
<html>
<head>
<style>
div {
margin: 15px;
padding: 20px;
width: 35%;
border: thin solid green;
outline-width: 5px;
outline-style: ridge;
outline-color: fuchsia;
border-radius: 50px;
}
</style>
</head>
<body>
<h2>Example</h2>
<div>This is it!</div>
</body>
</html>
登錄后復(fù)制
輸出
這給出了以下輸出 –
示例
?現(xiàn)場演示
<!DOCTYPE html>
<html>
<head>
<style>
p {
margin: 40px;
padding: 12px;
width: 30%;
border: thick dashed green;
outline: 5px inset;
outline-color: fuchsia;
}
</style>
</head>
<body>
<h2>Demo Heading</h2>
<p>This is demo text surrounded by border and outline.</p>
</body>
</html>
登錄后復(fù)制
輸出
這給出了以下輸出 –
以上就是了解CSS邊框和輪廓之間的區(qū)別的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注www.92cms.cn其它相關(guān)文章！
