這個語法在CSS的運用上也可以說相當實用、廣泛也很簡易

在部落格上所見的部位,諸如:

網誌描述、側邊欄位、標題、內容、連結...都可以使用

像是我的貼紙複製框外框也是這語法的應用

在這裡先來個實例讓大家有個初步的概念之後,我們再來談細部吧

大致而言,框線的語法架構如下:

{border-bottom: 2px dashed #FF0000 ;}  

由上可知,框線語法的語法屬性分為四部份:

框線區域。②框線厚度。③框線樣式。④框線顏色。 


細部說明:

框線區域

 可以把框線定義在上、下、右、左等四塊區域,分別是top、bottom、right、left

 想要讓框線只有在左邊跟下面的話,語法改成:

 {border-left: 3px solid #FF0000 ; border-bottom: 3px solid #FF0000 ;} 

 中間記得要有分號→";"  

 如果想讓四邊都有框線,不必寫四次,只要改成:

 {border: 3px solid #FF0000 ;}  

 去掉border後方定義的區域語法top、bottom、right 或是 left 就可以了。


框線厚度:可以更改框線的厚薄程度

 大多是以"px"作為單位,數字則是影響框線厚度。


框線樣式:一共有八種樣式

set.jpg 


框線顏色

 可以參考這裡的色碼表來作調整→色碼表

 如果沒有你喜歡的,可以到網路上搜尋其他的色碼表找顏色喔!


總結

 其實也可以做出四邊不同顏色、不同樣式的框框效果

 就看大家要怎樣搭配運用囉!

 

以上就是框線的語法介紹

希望經由這樣的介紹,不會讓你對語法更模糊XD

祝大家能有個充滿七彩框線的部落格

 

如果妳覺得這篇不錯的話
請留個回應或是幫忙點一下旁邊的廣告給我當獎勵喔
不回應的話,我只好這樣做

本文歡迎轉載、引用,但請註明出處
圖片、檔案皆存放於本人空間
如欲再行分享,請上傳至自己的空間
勿以本人空間再行分享之實!
請注意網路禮儀!

 

arrow
arrow
    全站熱搜

    月橘 發表在 痞客邦 留言(10) 人氣()