close



 ~(請關掉右邊欄位 ♣音樂盒★)~~ 












~CSS工具語法~
- by雲濤夢筆

 

 



圖個自己方便,在這裡放語法當工具書來用,免去翻書。


CSS語法工具


Background:設定背景顏色或圖檔。
 例:#ycmntlist .mbd .listbd {background:#000000}


background-attachment:背景圖是否隨捲軸移動。
  scroll:可移動。例:background-attachment:scroll
 fixed:不動。例:background-attachment:fixed


background-color:設定背景顏色。
  #色碼。例:background-color:#ff00ff
  transparent:透明背景。例:border-color:transparent


background-image:設定背景圖片。
  例:background-image:url("鏈結網址")


background-repeat:圖片在背景的補滿方式。
 repeat:重複補滿。例:background-repeat:repeat

repeat-x:以水平區域補滿。例:background-repeat:repeat-x
repeat-y:以垂直區域補滿。例:background-repeat:repeat-y
no-repeat:只顯示原圖。例:background-repeat:no-repeat


background-position:設定圖片開始的地方。
top:從圖片區域的頂端(0%)  例:background-position:top
bottom:圖片區域的底部(100%)  例:background-position:bottom
center:圖片區域的中間開始(50%) 例:background-position:center
left:從圖片區域的左邊(0%)  例:background-position:left
right:從圖片區域的右邊(100%) 例:background-position:right
 

Border :同時對四邊外邊框設定其線條樣式、寬度、顏色,
此一元素設定無法單獨設定單方向。
border-bottom:同時設定下外邊框的線條樣式、寬度、顏色。
border-bottom-color:單一設定下外邊框的顏色。
border-bottom-style:單一設定下外邊框的線條。
border-bottom-width:單一設定下外邊框的寬度。


border-top:同時設定上外邊框的線條樣式、寬度、顏色。
border-top-color:單一設定上外邊框的顏色。
border-top-style:單一設定上外邊框的線條。
border-top-width:單一設定上外邊框的寬度。


border-left:同時設定左外邊框的線條樣式、寬度、顏色。
border-left-color:單一設定左外邊框的顏色。
border-left-style:單一設定左外邊框的線條。
border-left-width:單一設定左外邊框的寬度。


border-right:同時設定右外邊框的線條樣式、寬度、顏色。
border-right-color:單一設定右外邊框的顏色。
border-right-style:單一設定右外邊框的線條。
border-right-width:單一設定右外邊框的寬度。


border-style:設定上下左右外邊框的線條格式。
使用時,可用4,3,2,1的參數。其元素值有:
    none→無框線
    hidden→隱藏框線
    dotted→點狀框線
    dashed→虛線
    solid→一條直線
    double→二條直線
  groove→立體內凹直線
    ridge→立體外凸直線
  inset→內凹直線
  outset→外凸直線
            
border-width:設定上下左右外邊框的線條寬度。
例:border-width:10 10 10 10
border-color:設定上下左右外邊框的線條顏色。



color:#色碼 , 或直接用顏色英文代替。
如:紅色→red。例:color:#000000


cursor:游標型式


  例:cursor:hand  或 cursor:url(網址)



font-family:設定字型
例:font-family:"標楷體"
font-size:字體大小
例:控制文字不隨瀏覽器的檢視而變動body{font-size:10px ; line-height:1em}
font-style:設定斜體 
   例:font-style:italic  or  font-sytle:oblique
font-variant:將所有英文字變成小寫字母的大小,
並將所有小寫字母變成大寫字母。
   例:font-variant:small-caps
font-weight:粗體字設定。
   bold:粗體。例:font-weight:bold
   bolder:比粗體更粗。例:font-weight:bolder
   lighter:比粗體更細。例:font-weight:lighter


height:元件區的高度。
   例:height:20px


litter-spacing:
line-height:圖型放大縮小


list-style-image:設定圖片作為清單符號。
   例:list-style-image:url(http://"網址")


list-style-position:設定是否突顯清單符號。
    inside:符號在文字內。例:list-style-position:inside
   outside:符號在文字外。例:list-style-position:outside


list-style-type:設定清單的符號或序號的格式(ie6有點問題)



margin:設定四周圍空白寬度。margin:10 0 0 -10
margin-bottom:下周圍空白寬度。例:margin-bottom:5
margin-left:  左周圍空白寬度。例:margin-left:10
margin-right: 右上周圍空白寬度。例:margin-right:15
margin-top:   上周圍空白寬度。例:margin-top:20


overflow:設定方塊捲軸
   visible:內容不被裁減,會超過方塊範圍。
   hidden:內容被裁減,但不會出現捲軸
   scroll:出現捲軸,但依內容而定
   auto:由瀏覽決定出現捲軸時機


overflow-x:僅出現在水平向
overflow-y:僅出現在垂直向


scrollbar-3dlight-color:捲軸方塊及捲動軸左邊與頂端的顏色。
scrollbar-3dlight-color:#000000
scrollbar-darkshadow-color:捲軸方塊及捲動軸右邊與底部的顏色。
scrollbar-highlight-color:捲軸方塊及捲動軸左邊與頂端的顏色,
比scrollbar-3dlight-color 更深一層。
scrollbar-shadow-color:捲軸方塊及捲動軸右邊與底部的顏色,
比scrollbar-darkshadow-color更深一層。
scrollbar-arroe-color: 設定捲軸方塊箭頭顏色。
scrollbar-face-color: 設定捲軸方塊及捲動軸的顏色。
scrollbar-base-color: 設定捲軸方塊、捲動軸及箭頭顏色。
scrollbar-track-color: 設定捲軸背景(捲軸軌跡)的顏色。


padding: 設定元件區或上右下左邊框的距離。
   例: padding:60px 70px 80px 100px
padding-bottom: 元件與下外邊框的距離。
   例:padding-bottom:100px
padding-left : 元件與左外邊框的距離。
    例: padding-left :100px
padding-right: 元件與右外邊框的距離。
   例: padding-right:100px
padding-top: 元件與上外邊框的距離。
  例:padding-top:100px


position


text-align:設定文字對齊方式。
  left:靠左
  center:置中
  right:靠右
   justofy:左右分散


text-decoration:文字線條特效。控制超鏈結時的顏色與底線
   underlint":文字加底線
  overline:大字加上方線
   linethrough:文字加中間穿越線
   blink:文字閃爍


text-layout:設定表格行列的排版方式。
   auto:自動排版
   fixed:固定排版


text-transform:設定英文字母大小寫。
   capitalize:單字第一個字母大寫)
   uppercase:大寫
   lowercase:小寫


width:元件區域的寬度。
   例:width:200px


!important:強制不被覆蓋


 


您可使用下列的HTML標籤及CSS語法,來編輯您的部落格文章。


請注意:使用圖片的HTML語法,需特別標示出長跟寬的尺寸。(例如:< img src="myimage.jpg" height="50" width="50" >)若圖片沒有標示長寬的屬性,將無法正常顯示。



















































































































































HTML 標籤屬性
a
href, name, rel, style, title
abbr title, style
acronym title, style
b title, style
big title, style
blockquote cite, title, style
br 
center title, style
cite title, style
code title, style
dd align, style
div align, style
dl align, style
dt align, style
em title, style
font color, face, size, style
h1 title, style
h2 title, style
h3 title, style
h4 title, style
h5 title, style
h6 title, style
hr title, style
i title, style
img src (required), width (required), height (required), alt
li title, style
ol title, style
p align
pre title, style
s title, style
small title, style
span title, style
strike title, style
strong title, style
sub title, style
sup title, style
table align, bgcolor, border, cellpadding, cellspacing, frame, rules, summary, title, style
tbody align, char, charoff, valign, title, style
td abbr, align, axis, bgcolor, char, charoff, colspan, headers, height,rowspan, scope, valign, title, style
tfoot align, char, charoff, valign, title, style
thead align, char, charoff, valign, title, style
tr align, bgcolor, char, charoff, valign, title, style
tt title, style
u title, style
ul title, style
xmp title, style

 

 

 


 


 ~本文【背景音樂&文章框架】來自~百合珍妮的天空:【你是誰】~ 

 


 

arrow
arrow
    全站熱搜

    Myshero 發表在 痞客邦 留言(0) 人氣()