CSS樣式小筆記

2021-08-21 02:58:47 字數 4929 閱讀 2477

樣式 (偏斜體) italic;(斜體) normal;(正常)

行高 (正常) 單位:px、pd、em

粗細 (粗體) lighter;(細體) normal;(正常)

變體 (小型大寫字母) normal;(正常)

大小寫 (首字母大寫) uppercase;(大寫) lowercase;(小寫) none;(無)

修飾 (下劃線) overline;(上劃線) line-through;(刪除線) blink;(閃爍)

常用字型: (font-family)」courier new」, courier, monospace, 「times new roman」, times, serif, arial, helvetica, sans-serif, verdana

重複 滾動 (固定) scroll;(滾動)

位置 (水平) top(垂直);

簡寫方法 /簡寫·這個在閱讀**中經常出現,要認真的研究/

對齊 (兩端對齊) left;(左對齊) right;(右對齊) center;(居中)

縮排 垂直對齊 (基線) sub;(下標) super;(下標) top; text-top; middle; bottom; text-bottom;

詞間距word-spacing: normal; 數值

空格white-space: pre;(保留) nowrap;(不換行)

顯示 (塊) inline;(內嵌) list-item;(列表項) run-in;(追加部分) compact;(緊湊) marker;(標記) table; inline-table; table-raw-group; table-header-group; table-footer-group; table-raw; table-column-group; table-column; table-cell; table-caption;(**標題) /display 屬性的了解很模糊/

height: 高

float:

clear:

both;

margin:

padding:

border-width:; 邊框寬度

border-color:#;

簡寫方法border:width style color; /簡寫/

位置list-style-position: outside;(外) inside;

影象list-style-image: url(..);

visibility: inherit; visible; hidden;

overflow: visible; hidden; scroll; auto;

clip: rect(12px,auto,12px,auto) (裁切)

font-family : 宋體,sans-serif; /文字字型/

font-size : 9pt; /文字大小/

font-style:itelic; /文字斜體/

font-variant:small-caps; /小字型/

letter-spacing : 1pt; /字間距離/

line-height : 200%; /設定行高/

font-weight:bold; /文字粗體/

vertical-align:sub; /下標字/

vertical-align:super; /上標字/

text-decoration:line-through; /加刪除線/

text-decoration: overline; /加頂線/

text-decoration:underline; /加下劃線/

text-decoration:none; /刪除鏈結下劃線/

text-transform : capitalize; /首字大寫/

text-transform : uppercase; /英文大寫/

text-transform : lowercase; /英文小寫/

text-align:right; /文字右對齊/

text-align:left; /文字左對齊/

text-align:center; /文字居中對齊/

text-align:justify; /文字分散對齊/

vertical-align屬性

vertical-align:top; /垂直向上對齊/

vertical-align:bottom; /垂直向下對齊/

vertical-align:middle; /垂直居中對齊/

vertical-align:text-top; /文字垂直向上對齊/

vertical-align:text-bottom; /文字垂直向下對齊/

padding-right:10px; /右邊框留空白/

padding-bottom:10px; /下邊框留空白/

padding-left:10px; /*左邊框留空白

list-style-type:decimal; /阿拉伯數字/

list-style-type:lower-roman; /小寫羅馬數字/

list-style-type:upper-roman; /大寫羅馬數字/

list-style-type:lower-alpha; /小寫英文本母/

list-style-type:upper-alpha; /大寫英文本母/

list-style-type:disc; /實心圓形符號/

list-style-type:circle; /空心圓形符號/

list-style-type:square; /實心方形符號/

list-style-image:url(/dot.gif); /式符號/

list-style-position: outside; /凸排/

list-style-position:inside; /縮排/

background:transparent; /透視背景/

background-image : url(/image/bg.gif); /背景/

background-attachment : fixed; /浮水印固定背景/

background-repeat : repeat; /重複排列-網頁預設/

background-repeat : no-repeat; /不重複排列/

background-repeat : repeat-x; /在x軸重複排列/

background-repeat : repeat-y; /在y軸重複排列/

background-position : top; /向上對齊/

background-position : buttom; /向下對齊/

background-position : left; /向左對齊/

background-position : right; /向右對齊/

background-position : center; /居中對齊/

a:link /超連結文字格式/

a:visited /瀏覽過的鏈結文字格式/

a:active /按下鏈結的格式/

十字型 cursor:crosshair

箭頭朝下 cursor:s-resize

十字箭頭 cursor:move

箭頭朝右 cursor:move

加一問號 cursor:help

箭頭朝左 cursor:w-resize

箭頭朝上 cursor:n-resize

箭頭朝右上 cursor:ne-resize

箭頭朝左上 cursor:nw-resize

文字i型 cursor:text

箭頭斜右下 cursor:se-resize

箭頭斜左下 cursor:sw-resize

漏斗 cursor:wait

游標圖案(ie6) p

border-bottom : 1px solid #6699cc; /下框線/

border-left : 1px solid #6699cc; /左框線/

border-right : 1px solid #6699cc; /右框線/

border-top-width :1px /設定上框線top寬度/

border-top-style : solid/設定上框線top樣式/

dotted /虛線框/

double /雙線框/

groove /立體內凸框/

ridge /立體浮雕框/

inset /凹框/

outset /凸框/

margin-right:10px; /右邊界值/

margin-bottom:10px; /下邊界值/

margin-left:10px; /左邊界值/

字型型別

字型大小

字型風格

字型粗細

字型顏色

陰影顏色

字型行高

字 間 距

單詞間距

字型變形

英文轉換

字型變形

字型 文字修飾

段首空格

水平對齊

垂直對齊

書寫方式

背景 背景重複

背景固定

背景定位

背影樣式

補  白

邊框寬度  

寬度值: thin|medium|thick|數值

邊框顏色   數值:分別代表top、right、bottom、left顏色值

邊框風格

邊  框

上 邊 框

右 邊 框

下 邊 框

左 邊 框

寬  度

高  度

漂  浮

清  除

控制空白

符號列表

圖形列表

位置列表

目錄列表

滑鼠形狀

css知識筆記(五) css樣式設定小技巧

如果被設定元素為文字 等行內元素時,水平居中是通過給父元素設定text align center來實現的。如下 html 我是文字,哈哈,我想要在父容器中水平居中顯示。css 當被設定元素為塊狀元素時用 text align center 就不起作用了,這時也分兩種情況 定寬塊狀元素和不定寬塊狀元素...

css樣式小技巧

1.css樣式小技巧 html怎樣設定使背景不隨頁面滾動而滾動 background attachment fixed 2.實現li a 超過長度內容出現省略號 overflow hidden white space nowrap text overflow ellipsis 3.使用 line h...

css樣式小技巧

1.css樣式小技巧 html怎樣設定使背景不隨頁面滾動而滾動 background attachment fixed 2.實現li a 超過長度內容出現省略號 overflow hidden white space nowrap text overflow ellipsis 3.使用 line h...