CSS語言大全
CSS語言大全,如下:字體屬性:(font)大小 {font-size: x-large;}(特大) xx-small;(極小) 一般中文用不到,只要用數值就可以,單位:PX、PD樣式 {font-style: oblique;}(偏斜體) italic;(斜體) normal;(正常)行高 {line-height: normal;}(正常) 單位:PX、PD、EM粗細 {font-weight: bold;}(粗體) lighter;(細體) normal;(正常)變體 {font-variant: small-caps;}(小型大寫字母) normal;(正常)大小寫 {text-transform: capitalize;}(首字母大寫) uppercase;(大寫) lowercase;(小寫) none;(無)修飾 {text-decoration: underline;}(下劃線) overline;(上劃線) line-through;(刪除線) blink;(閃爍)常用字體: (font-family)"Courier New", Courier, monospace, "Times New Roman", Times, serif, Arial, Helvetica, sans-serif, Verdana背景屬性: (background)色彩 {background-color: #FFFFFF;}圖片 {background-image: url();}重復 {background-repeat: no-repeat;}滾動 {background-attachment: fixed;}(固定) scroll;(滾動)位置 {background-position: left;}(水平) top(垂直);簡寫方法 {background:#000 url(..) repeat fixed left top;} /*簡寫·這個在閱讀代碼中經常出現,要認真的研究*/區塊屬性: (Block) /*這個屬性第一次認識,要多多研究*/字間距 {letter-spacing: normal;} 數值 /*這個屬性似乎有用,多實踐下*/對齊 {text-align: justify;}(兩端對齊) left;(左對齊) right;(右對齊) center;(居中)縮進 {text-indent: 數值px;}垂直對齊 {vertical-align: baseline;}(基線) sub;(下標) super;(下標) top; text-top; middle; bottom; text-bottom;詞間距word-spacing: normal; 數值空格white-space: pre;(保留) nowrap;(不換行)顯示 {display:block;}(塊) 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 屬性的了解很模糊*/方框屬性: (Box)width:; height:; float:; clear:both; margin:; padding:; 順序:上右下左邊框屬性: (Border)border-style: dotted;(點線) dashed;(虛線) solid; double;(雙線) groove;(槽線) ridge;(脊狀) inset;(凹陷) outset;border-width:; 邊框寬度border-color:#;簡寫方法border:width style color; /*簡寫*/列表屬性: (List-style)類型list-style-type: disc;(圓點) circle;(圓圈) square;(方塊) decimal;(數字) lower-roman;(小羅碼數字) upper-roman; lower-alpha; upper-alpha;位置list-style-position: outside;(外) inside;圖像list-style-image: url(..);定位屬性: (Position)Position: absolute; relative; static;visibility: inherit; visible; hidden;overflow: visible; hidden; scroll; auto;clip: rect(12px,auto,12px,auto) (裁切)css屬性代碼大全一 CSS文字屬性:color : #999999; /*文字顏色*/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; /*文字垂直向下對齊*/ 二、CSS邊框空白padding-top:10px; /*上邊框留空白*/ padding-right:10px; /*右邊框留空白*/ padding-bottom:10px; /*下邊框留空白*/ padding-left:10px; /*左邊框留空白三、CSS符號屬性:list-style-type:none; /*不編號*/ 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(/*); /*圖片式符號*/ list-style-position: outside; /*凸排*/ list-style-position:inside; /*縮進*/ 四、CSS背景樣式:background-color:#F5E2EC; /*背景顏色*/ background:transparent; /*透視背景*/ background-image : url(/image/*); /*背景圖片*/ background-attachment : 。
什么是css語言
什么是CSS呢?你可能急迫的想知道答案。
但是空泛的文字描述意義不大,讓我們先來一點感性體驗吧。看看這個沒有添加CSS的HTML文件: http://*** 是一個普普通通的網頁。
然而通過給這個文件添加的CSS規則,我們可以得到十分美觀的網頁: http://** 這還不是全部,不改動HTML,只是通過添加不同的CSS規則,我們就可以得到各種不同樣式的網頁: http://**?cssfile=/208/*&page=0 好了,下面我們再來回答什么是CSS這個問題。 什么是Cascading Style Sheets(層疊樣式表) * CSS是Cascading Style Sheets(層疊樣式表)的簡稱. * CSS語言是一種標記語言,它不需要編譯,可以直接由瀏覽器解釋執行(屬于瀏覽器解釋型語言). * 在標準網頁設計中CSS負責網頁內容(XHTML)的表現. * CSS文件也可以說是一個文本文件,它包含了一些CSS標記,CSS文件必須使用css為文件名后綴. * 可以通過簡單的更改CSS文件,改變網頁的整體表現形式,可以減少我們的工作量,所以她是每一個網頁設計人員的必修課. * CSS是由W3C的CSS工作組產生和維護的. [編輯本段]如何將樣式表加入到網頁 可以用以下三種方式將樣式表加入您的網頁。
而最接近目標的樣式定義優先權越高。高優先權樣式將繼承低優先權樣式的未重疊定義但覆蓋重疊的定義。
例外請參閱 !important 聲明。 鏈入外部樣式表文件 (Linking to a Style Sheet) 你可以先建立外部樣式表文件(.css),然后使用HTML的link對象。
示例如下:
定義方式請參閱樣式表語法。示例如下:
內聯定義 (Inline Styles) 內聯定義即是在對象的標記內使用對象的style屬性定義適用其的樣式表屬性。示例如下: 這一行被增加了左右的外補丁 [編輯本段]CSS的語法: CSS的定義是由三個部分構成: 選擇符(selector),屬性(properties)和屬性的取值(value)。
ccs 語法: selector {property: value} (選擇符 {屬性:值}) 說明: ·選擇符是可以是多種形式,一般是你要定義樣式的HTML標記,例如BODY、P、TABLE……,你可以通過此方法定義它的屬性和值,屬性和值要用冒號隔開: 例子:body {color: black},此例的效果是使頁面中的文字為黑色。 ·如果屬性的值是多個單詞組成,必須在值上加引號,比如字體的名稱經常是幾個單詞的組合: 例子:p {font-family: "sans serif"} (定義段落字體為sans serif) · 如果需要對一個選擇符指定多個屬性時,我們使用分號將所有的屬性和值分開: 例子:p {text-align: center; color: red} (段落居中排列;并且段落中的文字為紅色) 2. 選擇符組 你可以把相同屬性和值的選擇符組合起來書寫,用逗號將選擇符分開,這樣可以減少樣式重復定義: h1, h2, h3, h4, h5, h6 { color: green } (這個組里包括所有的標題元素,每個標題元素的文字都為綠色) p, table{ font-size: 9pt } (段落和表格里的文字尺寸為9號字) 效果完全等效于: p { font-size: 9pt } table { font-size: 9pt } 3. 類選擇符 用類選擇符你能夠把相同的元素分類定義不同的樣式,定義類選擇符時,在自定類的名稱前面加一個點號。
假如你想要兩個不同的段落,一個段落向右對齊,一個段落居中,你可以先定義兩個類: * {text-align: right} * {text-align: center} 然后用不在不同的段落里,只要在HTML標記里加入你定義的class參數: 這個段落向右對齊的 這個段落是居中排列的 類選擇符還有一種用法,在選擇符中省略HTML標記名,這樣可以把幾個不同的元素定義成相同的樣式: .center {text-align: center} (定義.center的類選擇符為文字居中排列) 這樣的類可以被應用到任何元素上。下面我們使h1元素(標題1)和p元素(段落)都歸為“center”類,這使兩個元素的樣式都跟隨“.center”這個類選擇符:
這個標題是居中排列的
這個段落也是居中排列的 注意:這種省略HTML標記的類選擇符是我們經后最常用的CSS方法,使用這種方法,我們可以很方便的在任意元素上套用預先定義好的類樣式。4. ID選擇符 在HTML頁面中ID參數指定了某個單一元素,ID選擇符是用來對這個單一元素定義單獨的樣式。 ID選擇符的應用和類選擇符類。
CSS語言大全
字體屬性:(font)大小 {font-size: x-large;}(特大) xx-small;(極小) 一般中文用不到,只要用數值就可以,單位:PX、PD樣式 {font-style: oblique;}(偏斜體) italic;(斜體) normal;(正常)行高 {line-height: normal;}(正常) 單位:PX、PD、EM粗細 {font-weight: bold;}(粗體) lighter;(細體) normal;(正常)變體 {font-variant: small-caps;}(小型大寫字母) normal;(正常)大小寫 {text-transform: capitalize;}(首字母大寫) uppercase;(大寫) lowercase;(小寫) none;(無)修飾 {text-decoration: underline;}(下劃線) overline;(上劃線) line-through;(刪除線) blink;(閃爍) 常用字體: (font-family)"Courier New", Courier, monospace, "Times New Roman", Times, serif, Arial, Helvetica, sans-serif, Verdana 背景屬性: (background)色彩 {background-color: #FFFFFF;}圖片 {background-image: url();}重復 {background-repeat: no-repeat;}滾動 {background-attachment: fixed;}(固定) scroll;(滾動)位置 {background-position: left;}(水平) top(垂直);簡寫方法 {background:#000 url(..) repeat fixed left top;} /*簡寫·這個在閱讀代碼中經常出現,要認真的研究*/ 區塊屬性: (Block) /*這個屬性第一次認識,要多多研究*/字間距 {letter-spacing: normal;} 數值 /*這個屬性似乎有用,多實踐下*/對齊 {text-align: justify;}(兩端對齊) left;(左對齊) right;(右對齊) center;(居中)縮進 {text-indent: 數值px;}垂直對齊 {vertical-align: baseline;}(基線) sub;(下標) super;(下標) top; text-top; middle; bottom; text-bottom;詞間距word-spacing: normal; 數值空格white-space: pre;(保留) nowrap;(不換行) 顯示 {display:block;}(塊) 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 屬性的了解很模糊*/ 方框屬性: (Box)width:; height:; float:; clear:both; margin:; padding:; 順序:上右下左邊框屬性: (Border)border-style: dotted;(點線) dashed;(虛線) solid; double;(雙線) groove;(槽線) ridge;(脊狀) inset;(凹陷) outset;border-width:; 邊框寬度border-color:#; 簡寫方法border:width style color; /*簡寫*/ 列表屬性: (List-style)類型list-style-type: disc;(圓點) circle;(圓圈) square;(方塊) decimal;(數字) lower-roman;(小羅碼數字) upper-roman; lower-alpha; upper-alpha;位置list-style-position: outside;(外) inside;圖像list-style-image: url(..);定位屬性: (Position)Position: absolute; relative; static;visibility: inherit; visible; hidden;overflow: visible; hidden; scroll; auto;clip: rect(12px,auto,12px,auto) (裁切) css屬性代碼大全一 CSS文字屬性:color : #999999; /*文字顏色*/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; /*文字垂直向下對齊*/ 二、CSS邊框空白padding-top:10px; /*上邊框留空白*/ padding-right:10px; /*右邊框留空白*/ padding-bottom:10px; /*下邊框留空白*/ padding-left:10px; /*左邊框留空白三、CSS符號屬性:list-style-type:none; /*不編號*/ 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(/*); /*圖片式符號*/ list-style-position: outside; /*凸排*/ list-style-position:inside; /*縮進*/ 四、CSS背景樣式:background-color:#F5E2EC; /*背景顏色*/ background:transparent; /*透視背景*/ background-image : url(/image/*); /*背景圖片*/ background-attachment : fixed; /*浮水印固。
這三條css語句,為什么第一句中的div前加了“#”,而第二句的? 愛
沒有加#或者.的是全局DIV,就是所有DIV都用這個樣式。
#是ID,.是class,ID優先級比class要高。 solid是倒是不知道是什么標簽,但是broder里面有個線條樣式是solid,直線。
onm ouseover="*menbyid('div1').style=" "這句是鼠標移上,得到(div1)這個Id,并且給這個ID設置樣式是顯示。 onm ouseout="*menbyid('div1').style=" "鼠標移除則這個塊兒隱藏。
css的基本語句是什么
css作為頁面樣式設置,對頁面上的各種組件都可以改變其默認樣式并設置你想要的個性樣式,以table舉例:
*ame{font-size: 9pt; background-color: #CCCCCC}
*ame{font-size: 9pt; color: #000000; font-weight: bold; background-color: #6EC29F;}
*ame{font-size: 9pt; color:#000000; background-color: #EBF6FF; text-align:right;text-decoration: none; font-family: "Arial", "Helvetica", "sans-serif"}
這就是對table組件的具體設置,包含了背景顏色,文字的字體、size、weight,對齊方式等。其他的組件類似。
css的基本語句的結構是
一個樣式表一般由若干樣式規則組成,每條樣式規則都可以看作是一條CSS的基本語句。
每條規則都包含一個選擇器(例如:BODY,P等)和寫在花括號里的聲明,這些聲明通常是由幾組用分號分隔的屬性和值組成。
有6種合法的選擇器類別,即:HTML標記、具有上下文關系的HTML標記、用戶定義的類、用戶定義的ID、虛類、虛元素。
*標記
例如:H1{text-align:center;font-family:楷體-gb2312},H1,H2,H3{color:#ff0000}
2.具有上下文關系的HTML標記
例如:H1 B{color:red},這表示只有位于標記元素內的 標記符說明的內容顯示為紅色,其它標記符所說明的元素不具有該屬性。這種上下文關系可以多層嵌套。
3.用戶定義的類
要想將一個類包括到樣式定義中,可將一個句點和一個類名添加到選擇器后,即:選擇器.類名{屬性:值;……}
可以使用任何名稱命名類,例如:若想在網頁使用 ,并使每處文本具有不同的顏色,則可進行如下定義:*-red{color:red}*-blue{color:blue}
然后在網頁中需要使用CLASS屬性的地方引用這些類,例如:第一章 HTML,第二章 CSS技術〈/H2〉如果使用了 標記符,但未使用CLASS屬性,則不會應用所定義的樣式。
特別地,還可以定義應用于所有標記符的類,此時,直接用句點后跟類名即可,例如:.red{color:red}然后在所有需要引用該類的標記符中使用CLASS屬性。
4.用戶定義的ID
所謂ID,就是相當于HTML文檔中的樣式的“身份證”,以保證其在一個HTML文檔中具有唯一可用的值。這給使用JAVAScript等腳本編寫語言的 應用帶來了方便。要將一個ID包括在樣式定義中,需要“#”號作為ID名稱的前綴,格式如下:#ID名字{屬性:值}
定義了ID樣式后,則可通過在標記符內使用ID屬性來引用該樣式。例如:有定義#red{color:red},則可在若干不同標記符中使用。
5.虛類和虛元素
虛類也稱偽類(Peeudo-class),它可以區別開不同種類的元素。虛元素(Pseudo-element)指元素的一部分,如段落的第一個字母和首行效果(first-letter和first-line)。
虛類和虛元素只可以用在CSS的選擇器中,而不能出現在HTML的源代碼中,即不能用CLASS或ID來調用。它們只能在特定條件下被瀏覽器所識別。
偽類中最常見的就是錨偽類。錨偽類可以指定標記符以不同方式顯示鏈接,即訪問過的(visited)、未訪問過的(link)、激活的(active)和鼠標指向的(hover)幾種鏈接狀態。例如可以使用下列方式更改超鏈接的顯示方式:A:link {text-decoration:none;color:#800000},A:visited {text-decoration:none;color:#800000},A:active {text-decortion:none},A:hover {text-decoration:underline;color:blue}