csssolid的意思是什么-創(chuàng)新互聯(lián)

本篇文章為大家展示了css solid的意思是什么，代碼簡(jiǎn)明扼要并且容易理解，絕對(duì)能使你眼前一亮，通過這篇文章的詳細(xì)介紹希望你能有所收獲。

創(chuàng)新互聯(lián)-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設(shè)、高性價(jià)比洛扎網(wǎng)站開發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫(kù),直接使用。一站式洛扎網(wǎng)站制作公司更省心,省錢,快速模板網(wǎng)站建設(shè)找我們，業(yè)務(wù)覆蓋洛扎地區(qū)。費(fèi)用合理售后完善，十載實(shí)體公司更值得信賴。

Border（畫邊框），它是CSS的一個(gè)屬性，用它可以給能確定范圍的HTML標(biāo)記（如TD、DIV等等）畫邊框，可以給文本加邊框，給導(dǎo)航菜單加分隔線，下面與大家分享個(gè)實(shí)例，感興趣的朋友可以了解下

制作過網(wǎng)頁(yè)的人都有為畫線而煩惱的經(jīng)歷，先來認(rèn)識(shí)一下“Border”（畫邊框），它是CSS的一個(gè)屬性，用它可以給能確定范圍的HTML標(biāo)記（如TD、DIV等等）畫邊框，它可以定義邊框線的類型、寬度和顏色，利用這個(gè)特性，可以制作一些特殊效果。

style="border:thin solid red"

“border”后面的三個(gè)參數(shù)的含義是：邊框線的寬度是：thin（細(xì)線）；邊框線的類型：solid（實(shí)線）；邊框線的顏色：red（紅色）。

邊框線的寬度有三個(gè)標(biāo)準(zhǔn)值：thin（細(xì)線）、medium（中粗線）和thick（粗線），

1、給文本加邊框

上面的示例中，給一段文字加了不同的邊框，只是為了說明邊框線的顏色、粗細(xì)是可變的。

第一個(gè)邊框的CSS代碼是：style="border:thin solid red"；

“border”后面的三個(gè)參數(shù)的含義是：邊框線的寬度是：thin（細(xì)線）；邊框線的類型：solid（實(shí)線）；邊框線的顏色：red（紅色）。

邊框線的寬度有三個(gè)標(biāo)準(zhǔn)值：thin（細(xì)線）、medium（中粗線）和thick（粗線），

此外，也可以自定義寬度，如：1pt、5px、2cm等。

邊框線的類型有九個(gè)確定值：none（無邊框線）、 dotted（由點(diǎn)組成的虛線）、 dashed（由短線組成的虛線）、 solid（實(shí)線）、 double（雙線，雙線寬度加上它們之間的空白部分的寬度就等于border-width定義的寬度）、 groove（3D溝槽狀的邊框）、 ridge（3D脊?fàn)畹倪吙颍?inset（3D內(nèi)嵌邊框，顏色較深）、 outset（3D外嵌邊框，顏色較淺），

注意：如果系統(tǒng)不支持這些邊框的屬性值，那么“dotted”、“dashed”、“double”、“groove”、“ridge”、“inset”和“outset”都會(huì)被“solid”代替。

邊框線的顏色：可以用十六進(jìn)制的顏色代碼，如#00ffcc。

從上面可以看出，給文本加邊框確實(shí)很簡(jiǎn)單，上例中后面那幾個(gè)邊框的設(shè)置，我不講你也明白了吧！在這里告訴你一點(diǎn)小技巧，給一段文本加邊框，可把CSS加在〈P〉標(biāo)記里；給幾段文本加邊框，先把那幾段文本用DIV標(biāo)記括起來，再把CSS加在〈DIV〉標(biāo)記里；若是要給一行文本加幾個(gè)不同的邊框，則需要把文本放在表格里，再把CSS分別加到〈TD〉標(biāo)記里。

2、給導(dǎo)航菜單加分隔線

上面這個(gè)例子中的小白線，當(dāng)然可以用圖象來做，但我在這里是用CSS的“border”的擴(kuò)展屬性畫了邊框的一條邊，這樣代碼要少的多。畫邊框的單邊與上例的邊框的四條邊類似，一個(gè)邊框的四條邊的屬性如下：

邊框線名稱：border-top（上邊框線）、border-right（右邊框線）、border-bottom（下邊框線）和boder-left（左邊框線）；每條邊框線的類型、寬度和顏色的取值與“boder”屬性相同。如本例中要定義每個(gè)單元格的左邊框線為白色線，線的寬度為“1px”的實(shí)線，則CSS代碼是這樣的：style="border-left: 1px solid #ffffff"。

在單獨(dú)定義邊框線時(shí)，若不給出某個(gè)值，那么就取其默認(rèn)的初始值。在dreamweaver中定義CSS非常方便，不用編寫代碼；把常用的邊框線一次定義好，放在外連式CSS文件中，要用時(shí)調(diào)用一下就行了，非常方便。

3、在一個(gè)邊框中采用不同寬度和顏色的邊框線

在本例中的效果，當(dāng)然可以用上例中的方法來實(shí)現(xiàn)，但那樣代碼過多，可采用另一種合并的方法，把四條邊的屬性值分類放在一起，如本例的代碼是這樣的：

style="border-style:solid; border-width: thin thin thick thick;border-color:#00ff00 #00ff00 #0000ff #0000ff" 。

從上面可以看出，我把邊框線的類型、寬度和顏色歸類在一起定義了，這里請(qǐng)注意幾點(diǎn)：

一、四條邊框線的位置順序是：上邊框線、右邊框線、下邊框線、左邊框線；

二、我在本例中邊框線的類型只取了一種實(shí)線類型，實(shí)際上四條邊也可以分別定義不同的類型；

三、屬性值可以定義一個(gè)、兩個(gè)、三個(gè)或者四個(gè)。如果僅定義一個(gè)屬性值，則其余三個(gè)自動(dòng)取相同值，如：border-style:solid與border-style:solid solid solid solid的效果完全一樣；如果僅給出兩個(gè)或三個(gè)值，那么缺失邊的屬性值把取與對(duì)邊相同的值。如：boder-width:thin thick與border-width:thin thick thin thick效果相同，border-width:1px 2px 3px與border-width:1px 2px 3px 2px的效果相同。

Border屬性的靈活應(yīng)用，可以產(chǎn)生許多特殊效果，方法與上面介紹的相同。

例子：

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>一列固定寬度——</title> 
<style type="text/css"> 
<!-- 
#layout { 
border: 2px solid #A9C9E2; 
background-color: #E8F5FE; 
height: 200px; 
width: 300px; 
} 
--> 
</style> 
</head> 
<body> 
<div id="layout">hfhfg</div> 
</body> 
</html>

上述內(nèi)容就是css solid的意思是什么，你們學(xué)到知識(shí)或技能了嗎？如果還想學(xué)到更多技能或者豐富自己的知識(shí)儲(chǔ)備，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。

網(wǎng)站欄目：csssolid的意思是什么-創(chuàng)新互聯(lián)
文章源于：http://muchs.cn/article14/cocsde.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供外貿(mào)網(wǎng)站建設(shè)、企業(yè)網(wǎng)站制作、外貿(mào)建站、標(biāo)簽優(yōu)化、微信公眾號(hào)、品牌網(wǎng)站建設(shè)

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容