CSS樣式屬性表，查詢方便，真是不賴：）


【長度單位】

CSS可使用長度單位
單位 單位說明範例
ptPoint，就像是Word裡面的Point一樣大小font-size:10pt
pxPixels，依您螢幕解析度而決定大小font-size:10px
pcPica，6個Pica是一英吋font-size:10pc
mm公厘，用過尺...這個設定值完全不會因為其他設定而改變font-size:10mm
cm公分，不會因為使用者設定而改變font-size:10cm
%百分比，大部分是指所在位置寬度或者長度百分比font-size:10%

【顏色表示】

CSS可用顏色表示方式
表示方式 表示方式說明範例
#rrggbb可以用Windows色彩選擇工具找到color:#feefc7
rgb(#,#,#)用數字來表示紅色藍色以及綠色的混合...也可以用Windows色彩選擇工具找color:rgb(135,255,124)
rgb(%,%,%)用百分比來代表紅色藍色以及綠色的強度來混合顏色color:rgb(70%,35%,41%)
顏色名稱用顏色的名稱來指定顏色color:brown

【背景可用值】

CSS可用背景值
名稱 說明可能值範例
background背景下面的背景設定值皆適用background:fixed
background-attachment背景圖性是否固定fixed, scrollbackground-attachment:fixed
background-color背景顏色顏色
transparent(透空)		backgroun-color:yellow
background-image背景圖片none(無背景圖)
url(****)(圖片位置)		background-image:url(test.jpg)
background-position背景圖位置水平 垂直background-position:135 159
background-repeat背景是否重複repeat(重複)
repeat-x(水平重複)
repeat-y(垂直重複)
no-repeat(不重複)		background-repeat:repeat

【屬性可用值】

CSS可用屬性值
名稱 說明可能值範例
visibility顯示或是隱藏inherit(父元件決定)
hidden(隱藏)
visible(顯示)
　		visibility:hidden
width寬度auto(自動決定)
數字		width:135
height高度auto(自動決定)
數字		height:100
z-indexZ軸高度(立體，是否在另一個元件之上)auto(自動決定)
數字		z-index:135
position定位方式absolute
(絕對定位-依視窗座標，原點為父視窗左上角)
relative
(相對定位-以一般網頁排列[right.center.left]後再根據座標定位，原點為定位後的位置)
static
(靜態定位-以一般網頁排列)		position:absolute
top(物件的position屬性須為absolute或relative)物件的Y座標(原點根據postion屬性有所不同)數字　
left(物件的position屬性須為absolute或relative)物件的X座標(原點根據postion屬性有所不同)數字　

【文字設定可用值】

CSS可用文字設定值
名稱 說明可能值範例
font文字設定以下所有皆可使用
　		font:arial
font-family字體字體名稱font-family:arial
font-size字體大小百分比或是數字(單位)font-size:12px
font-style字型樣式normal(普通)
italic(斜體)
oblique(斜體)		font-style:italic
font-variant字型特別樣式normal(普通)
small-caps(大小英文字母)		font-variant:small-caps
font-weight字型粗細normal(普通)
bold(粗體)
bolder(超粗體)
lighter(細體)
數字(400=normal 700=bold )		font-weight:bolder
letter-spacing字元相距normal(普通)
數字(預設為0)		letter-spacing:5
text-align字元對齊left(左邊)
right(右邊)
center(中間)
justify(左右平分)		text-align:justify
text-decoration字元樣式none(普通)
underline(加底線)
no-underline(不加底線)
blink(閃爍)
no-blink(不閃爍)
line-through(加刪除線)
no-line-through(不加刪除線)
overline(加頂線)
no-overline(不加頂線)		text-decoration:underline

【表格設定】

CSS可用表格設定值       框線位置：(上-top.下-bottom.左-left.右-right)
名稱 說明可能值範例
border表格邊框設定以下所有皆可使用
　		border:green
border-color

border-(框線位置)-color

邊框顏色任何顏色表示方法 border-color:blue
border-style

border-(框線位置)-style

邊框樣式none(無邊框)
dotted(點線)
dashed(虛線)
solid(實線)
double(雙線)
groove(立體凹線)
ridge(立體凸線)
inset(立體嵌入線)
outset(立體隆起線)		border-style:dotted
border-width

border-(框線位置)-width

邊框寬度數字border-width:5
padding邊框補白數字padding:5

【滑鼠設定】

CSS可用滑鼠游標設定值
名稱 說明可能值範例
cursor游標圖示auto(自動決定)
default(預設值)
crosshair(十字)
hand(手形)
move(移動時的游標)
help(有問號的游標)
text(文字編輯的游標)
wait(忙碌中的游標)
w-resize(向左箭頭)
e-resize(向右箭頭)
n-resize(向上箭頭)
ne-resize{向右上箭頭)
nw-resize(向左上箭頭)
s-resize(向下箭頭)
se-resize(向右下箭頭)
sw-resize(向左下箭頭) 　		cursor:hand

【捲軸設定】

CSS可用捲軸列設定值
名稱 說明可能值範例
scrollbar-base-color捲軸列主色調顏色scrollbar-base-color:#aaaaaa
scrollbar-arrow-color按鈕箭頭的顏色顏色
　		scrollbar-arrow-color:#000000
scrollbar-face-color移動棒的顏色顏色scrollbar-face-color:#ffee99
scrollbar-highlight-color按鈕邊框內層左邊與上面的顏色及捲軸底部軌道網狀顏色(與track同時使用網狀會消失)顏色scrollbar-highlight-color: #000000
scrollbar-3dlight-color按鈕邊框外層左邊與上面的顏色顏色scrollbar-3dlight-color:#000000
scrollbar-darkshadow-color按鈕邊框外層右邊與下面的顏色顏色scrollbar-darkshadow-color:#000000
scrollbar-shadow-color按鈕邊框內層右邊與下面的顏色顏色scrollbar-track-color: #cccccc
scrollbar-track-color底部軌道顏色顏色scrollbar-track-color: #cccccc
arrow
arrow
    全站熱搜

    薇朵兒❤朵貓貓 發表在 痞客邦 留言(1) 人氣()

    E-mail轉寄