本篇文章為大家展示了css solid的意思是什么,代碼簡明扼要并且容易理解,絕對能使你眼前一亮,通過這篇文章的詳細介紹希望你能有所收獲。
創(chuàng)新互聯(lián)-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設、高性價比洛扎網(wǎng)站開發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫,直接使用。一站式洛扎網(wǎng)站制作公司更省心,省錢,快速模板網(wǎng)站建設找我們,業(yè)務覆蓋洛扎地區(qū)。費用合理售后完善,十載實體公司更值得信賴。Border(畫邊框),它是CSS的一個屬性,用它可以給能確定范圍的HTML標記(如TD、DIV等等)畫邊框,可以給文本加邊框,給導航菜單加分隔線,下面與大家分享個實例,感興趣的朋友可以了解下
制作過網(wǎng)頁的人都有為畫線而煩惱的經(jīng)歷,先來認識一下“Border”(畫邊框),它是CSS的一個屬性,用它可以給能確定范圍的HTML標記(如TD、DIV等等)畫邊框,它可以定義邊框線的類型、寬度和顏色,利用這個特性,可以制作一些特殊效果。
style="border:thin solid red"
“border”后面的三個參數(shù)的含義是:邊框線的寬度是:thin(細線);邊框線的類型:solid(實線);邊框線的顏色:red(紅色)。
邊框線的寬度有三個標準值:thin(細線)、medium(中粗線)和thick(粗線),
1、給文本加邊框
上面的示例中,給一段文字加了不同的邊框,只是為了說明邊框線的顏色、粗細是可變的。
第一個邊框的CSS代碼是:style="border:thin solid red";
“border”后面的三個參數(shù)的含義是:邊框線的寬度是:thin(細線);邊框線的類型:solid(實線);邊框線的顏色:red(紅色)。
邊框線的寬度有三個標準值:thin(細線)、medium(中粗線)和thick(粗線),
此外,也可以自定義寬度,如:1pt、5px、2cm等。
邊框線的類型有九個確定值:none(無邊框線)、 dotted(由點組成的虛線)、 dashed(由短線組成的虛線)、 solid(實線)、 double(雙線,雙線寬度加上它們之間的空白部分的寬度就等于border-width定義的寬度)、 groove(3D溝槽狀的邊框)、 ridge(3D脊狀的邊框)、 inset(3D內嵌邊框,顏色較深)、 outset(3D外嵌邊框,顏色較淺),
注意:如果系統(tǒng)不支持這些邊框的屬性值,那么“dotted”、“dashed”、“double”、“groove”、“ridge”、“inset”和“outset”都會被“solid”代替。
邊框線的顏色:可以用十六進制的顏色代碼,如#00ffcc。
從上面可以看出,給文本加邊框確實很簡單,上例中后面那幾個邊框的設置,我不講你也明白了吧!在這里告訴你一點小技巧,給一段文本加邊框,可把CSS加在〈P〉標記里;給幾段文本加邊框,先把那幾段文本用DIV標記括起來,再把CSS加在〈DIV〉標記里;若是要給一行文本加幾個不同的邊框,則需要把文本放在表格里,再把CSS分別加到〈TD〉標記里。
2、給導航菜單加分隔線
上面這個例子中的小白線,當然可以用圖象來做,但我在這里是用CSS的“border”的擴展屬性畫了邊框的一條邊,這樣代碼要少的多。畫邊框的單邊與上例的邊框的四條邊類似,一個邊框的四條邊的屬性如下:
邊框線名稱:border-top(上邊框線)、border-right(右邊框線)、border-bottom(下邊框線)和boder-left(左邊框線);每條邊框線的類型、寬度和顏色的取值與“boder”屬性相同。如本例中要定義每個單元格的左邊框線為白色線,線的寬度為“1px”的實線,則CSS代碼是這樣的:style="border-left: 1px solid #ffffff"。
在單獨定義邊框線時,若不給出某個值,那么就取其默認的初始值。在dreamweaver中定義CSS非常方便,不用編寫代碼;把常用的邊框線一次定義好,放在外連式CSS文件中,要用時調用一下就行了,非常方便。
3、在一個邊框中采用不同寬度和顏色的邊框線
在本例中的效果,當然可以用上例中的方法來實現(xiàn),但那樣代碼過多,可采用另一種合并的方法,把四條邊的屬性值分類放在一起,如本例的代碼是這樣的:
style="border-style:solid; border-width: thin thin thick thick;border-color:#00ff00 #00ff00 #0000ff #0000ff" 。
從上面可以看出,我把邊框線的類型、寬度和顏色歸類在一起定義了,這里請注意幾點:
一、四條邊框線的位置順序是:上邊框線、右邊框線、下邊框線、左邊框線;
二、我在本例中邊框線的類型只取了一種實線類型,實際上四條邊也可以分別定義不同的類型;
三、屬性值可以定義一個、兩個、三個或者四個。如果僅定義一個屬性值,則其余三個自動取相同值,如:border-style:solid與border-style:solid solid solid solid的效果完全一樣;如果僅給出兩個或三個值,那么缺失邊的屬性值把取與對邊相同的值。如:boder-width:thin thick與border-width:thin thick thin thick效果相同,border-width:1px 2px 3px與border-width:1px 2px 3px 2px的效果相同。
Border屬性的靈活應用,可以產(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>
上述內容就是css solid的意思是什么,你們學到知識或技能了嗎?如果還想學到更多技能或者豐富自己的知識儲備,歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道。
另外有需要云服務器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內外云服務器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡單易用、服務可用性高、性價比高”等特點與優(yōu)勢,專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應用場景需求。
網(wǎng)站欄目:csssolid的意思是什么-創(chuàng)新互聯(lián)
文章源于:http://aaarwkj.com/article14/cocsde.html
成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供外貿網(wǎng)站建設、企業(yè)網(wǎng)站制作、外貿建站、標簽優(yōu)化、微信公眾號、品牌網(wǎng)站建設
聲明:本網(wǎng)站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經(jīng)允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)