css概念、功能和語法

css概念、功能和語法

as是cacudingcacure，中文可譯為樣本紙或樣本表（風(fēng)格流程）。CSS在網(wǎng)頁里和HTML在一起作用,但是它不屬于HTML。使用CSS可以擴(kuò)展HTML的功能,使得用戶可以重新定義HTML元素的顯示方式。CSS所能改變的性質(zhì)有:字體、文字間的空間、列表、顏色、背景、Margin、位置等。使用CSS,用戶可以將格式和結(jié)構(gòu)分離,可以以前所未有的能力控制頁面布局,可以保證在所有瀏覽和平臺(tái)之間的兼容性,可以獲得更少的編碼、更少的頁數(shù)和更快的下載速度。1lector和properityCSS的每一條定義都有如下的形式:selector狖property:value;property:value;...狚,其中:selector:第一種是HTML的tag(標(biāo)簽),比如P,BODY,A等等;第二種叫class;第三種叫ID。property:就是那些將要被修改的性質(zhì)(屬性),比如color。value:給property賦的值(參數(shù)),比如給color的值為red。例如:CSS語句:A狖color:red狚定義所有的連接顏色為紅色。通常所有CSS的定義語句包括在STYLE元素里面放到HEAD中。2多條件定義紅色語活(1)HTMLselector:HTMLselector就是HTML的tags,比如P,DIV,TD等。如果CSS定義了它們,那么在整頁中這個(gè)Tag的性質(zhì)就按照CSS的定義來顯示。其語法如下:例如H1狖color:red狚將本頁中的H1的顏色設(shè)置成紅色;也可以在一條語句中同時(shí)定義多個(gè)selector:H1,H3,TD狖color:red狚。(2)CLASSselector:有兩種類型,一種是與一個(gè)HTML的tag有關(guān)聯(lián)的,叫做相關(guān)CLASSselector,語法是:另一種類型為獨(dú)立CLASSselector,即它可以與任何tag發(fā)生關(guān)聯(lián),語法為:(3)IDselector:IDselector與獨(dú)立classselector的功能基本一樣,區(qū)別在于它們的語法和用法不同,有ID的HTML元素可以被CSS-P和JavsScript來操縱,其語法如下:3所控制的聲母參數(shù)如表1(1)控制字形。CSS用來控制字形的性質(zhì)是font-family,可以用它來決定任何一個(gè)元素中文字的字形。例如:也可以同時(shí)列出多種字形,每個(gè)字形中間用逗號(hào)隔開,瀏覽器按先后順序來選擇使用,例如:(2)控制大小。用來控制字體大小的性質(zhì)是font-size.它的值可以在1～500間選擇。例如:(3)控制斜體。使字體成為斜體的性質(zhì)是font-style,例如:(4)控制加重。使字體成為重體的性質(zhì)是font-weight,它可以調(diào)節(jié)文字的粗細(xì),該性質(zhì)的值可以是lighte,normal,bold,bolder等。例如:(5)控制行距。使用ling-height性質(zhì)可以調(diào)節(jié)行距大小,有三種設(shè)定行距的方法:數(shù)字、長度單位和比例。例如:(6)控制看齊。使用text-align性質(zhì)可以控制看齊,它的可能值有l(wèi)eft(左),tight(右)、center(中間)、justify(左右),缺省值是left,即左對(duì)齊。例如:(7)控制段落的首行空格。使用textindent可以控制段落的首行空格。例如:P狖text-indent:lcm狚;段落的首行空格為1cm。這里的長度單位可以是in(英寸)、cm(厘米)、mm(毫米)、pt(點(diǎn)數(shù))、pc(打字機(jī)字間距)、em(ems)、ex(x-height)、px(象素)等等。(8)控制字母的大小寫?？梢允褂胻ext-transform來改變英文的大小寫。例如:(9)控制文字的裝飾。使用textdecoration控制文字的裝飾,即給文字加下滑線、刪除線等等。例如:(10)控制字間距。使用word-spacing可以控制字與字的間距大小。例如:H3狖word-spacing:lem狚;長度單位同上。11控制字母間距。使用letter-spacing可以控制字母與字母的間距。例如:H3狖letter-spacing:10px狚;長度單位同上。12控制邊距。使用頂邊距(margintop)、底邊距(margin-bottom)、左邊距(margin-left)和右邊距(margin-right)這4項(xiàng)屬性可以控制一個(gè)要素四周的邊距。例如:H4狖margin-top:20px;margin-bottom:5px;margin-left:100px;margin-right:55px狚13控制空格填充?？崭裉畛涞淖饔妙愃朴谶吘嗫刂?使用頂空格填充(padding-top)、底空格填充(paddingbottom)、左空格填充(padding-left)和右空格填充(padding-right)以設(shè)定一個(gè)要素前后左右的空格填充尺寸。例如:H4狖padding-top:20px:padding-bottom:5px;padding-left:100px;padding-right:55px狚14控制頂邊框?qū)挾?、底邊框?qū)挾?、左邊框?qū)挾群陀疫吙驅(qū)挾取Ｄ憧梢钥刂普麄€(gè)邊框的寬度,也可以分別控制每一邊的邊框?qū)挾?使用的性質(zhì)是:bordertop-width(頂)、border-bottom-width(底)、border-left-width(左)、borderright-width(右)和bordert-width(四周同寬)。例如:H4狖border-top-width:2px;borderbottom-width:5px;border-left-width:lpx;border-right-width:1px狚15控制邊框顏色。使用bordercolor可以控制邊框顏色(顏色的值可以有三種表示方法)。16控制邊框樣式。使用border-style可以控制邊框樣式,該性質(zhì)的可能值有:solid、double、dotted、dashed、groove、ridge、inset、outset等。例如:P狖border-style:double;border-width:3px狚17控制顏色。使用color可以控制顏色,顏色值的表示方法如前所述,例如:B狖color:#333399狚18控制背景色。使用backgroundcolor可以控制背景色,例如:P.yellow狖background-color:#FFFF66狚19控制背景圖象。使用background-image可以控制背景圖象,它的值可以是某GIF或JPEG圖象的URL,也可以是none(取消背景圖象),例如:B狖background-image:ur1(background.gif)狚20控制定位。使用position可以控制定位,定位又分為絕對(duì)定位(absolute)和相對(duì)定位(relative),絕對(duì)定位能使用戶精確地定位要素在頁面的獨(dú)立位置,而不考慮頁面其它要素的定位設(shè)置。相對(duì)定位是指用戶所定位的要素的位置相對(duì)于它在文件中所分配的位置。要定位距離時(shí),有四種方位:left、bottom、top、right,距離值可以使用各種長度單位或比例值。使用比例值時(shí),比例值指的是相對(duì)于母體要素的尺寸。例如:H4狖position:absolute;left:100px;top:43px狚;絕對(duì)定位;I狖position:relative;left:40px;top:10px狚;相對(duì)定位。4定義底層約束引入+承擔(dān)相關(guān)定義(1)對(duì)于不同的瀏覽器,甚至是不同瀏覽器的不同版本,CSS的使用都有所不同,有些CSS的定義甚至在某些瀏覽器的某些版本中無法使用,具體見相關(guān)文檔。(2)CSS的定義具有繼承性,即樣式表的定義可從母體延續(xù)到子體,嵌套的定義外層約束內(nèi)層,例如:〈B〉A(chǔ)llmyWebpageswillusecascadingstylesheetswithin〈I〉four〈/I〉weeks.〈/B〉因?yàn)椤碔〉標(biāo)簽位于〈B〉標(biāo)簽之內(nèi),所以它接受了〈B〉標(biāo)簽的定義。(3)