css程序如何工作
CSS能夠?qū)W(wǎng)頁中元素位置的排版進(jìn)行像素級精確控制,支持幾乎所有的字體字號樣式,擁有對網(wǎng)頁對象和模型樣式編輯的能力,那么你對CSS了解多少呢?以下是由學(xué)習(xí)啦小編整理關(guān)于什么是css的內(nèi)容,希望大家喜歡!
css的語言特點
CSS為HTML標(biāo)記語言提供了一種樣式描述,定義了其中元素的顯示方式。CSS在Web設(shè)計領(lǐng)域是一個突破。利用它可以實現(xiàn)修改一個小的樣式更新與之相關(guān)的所有頁面元素。
總體來說,CSS具有以下特點:
豐富的樣式定義
CSS提供了豐富的文檔樣式外觀,以及設(shè)置文本和背景屬性的能力;允許為任何元素創(chuàng)建邊框,以及元素邊框與其他元素間的距離,以及元素邊框與元素內(nèi)容間的距離;允許隨意改變文本的大小寫方式、修飾方式以及其他頁面效果。
易于使用和修改
CSS可以將樣式定義在HTML元素的style屬性中,也可以將其定義在HTML文檔的header部分,也可以將樣式聲明在一個專門的CSS文件中,以供HTML頁面引用??傊?,CSS樣式表可以將所有的樣式聲明統(tǒng)一存放,進(jìn)行統(tǒng)一管理。
另外,可以將相同樣式的元素進(jìn)行歸類,使用同一個樣式進(jìn)行定義,也可以將某個樣式應(yīng)用到所有同名的HTML標(biāo)簽中,也可以將一個CSS樣式指定到某個頁面元素中。如果要修改樣式,我們只需要在樣式列表中找到相應(yīng)的樣式聲明進(jìn)行修改。
多頁面應(yīng)用
CSS樣式表可以單獨存放在一個CSS文件中,這樣我們就可以在多個頁面中使用同一個CSS樣式表。CSS樣式表理論上不屬于任何頁面文件,在任何頁面文件中都可以將其引用。這樣就可以實現(xiàn)多個頁面風(fēng)格的統(tǒng)一。
層疊
簡單的說,層疊就是對一個元素多次設(shè)置同一個樣式,這將使用最后一次設(shè)置的屬性值。例如對一個站點中的多個頁面使用了同一套CSS樣式表,而某些頁面中的某些元素想使用其他樣式,就可以針對這些樣式單獨定義一個樣式表應(yīng)用到頁面中。這些后來定義的樣式將對前面的樣式設(shè)置進(jìn)行重寫,在瀏覽器中看到的將是最后面設(shè)置的樣式效果。
頁面壓縮
在使用HTML定義頁面效果的網(wǎng)站中,往往需要大量或重復(fù)的表格和font元素形成各種規(guī)格的文字樣式,這樣做的后果就是會產(chǎn)生大量的HTML標(biāo)簽,從而使頁面文件的大小增加。而將樣式的聲明單獨放到CSS樣式表中,可以大大的減小頁面的體積,這樣在加載頁面時使用的時間也會大大的減少。另外,CSS樣式表的復(fù)用更大程序的縮減了頁面的體積,減少下載的時間。
css的工作原理
CSS是一種定義樣式結(jié)構(gòu)如字體、顏色、位置等的語言,被用于描述網(wǎng)頁上的信息格式化和現(xiàn)實的方式。CSS樣式可以直接存儲于HTML網(wǎng)頁或者單獨的樣式單文件。無論哪一種方式,樣式單包含將樣式應(yīng)用到指定類型的元素的規(guī)則。外部使用時,樣式單規(guī)則被放置在一個帶有文件擴(kuò)展名_css的外部樣式單文檔中。
樣式規(guī)則是可應(yīng)用于網(wǎng)頁中元素,如文本段落或鏈接的格式化指令。樣式規(guī)則由一個或多個樣式屬性及其值組成。內(nèi)部樣式單直接放在網(wǎng)頁中,外部樣式單保存在獨立的文檔中,網(wǎng)頁通過一個特殊標(biāo)簽鏈接外部樣式單。
名稱CSS中的“層疊(cascading)”表示樣式單規(guī)則應(yīng)用于HTML文檔元素的方式。具體地說,CSS樣式單中的樣式形成一個層次結(jié)構(gòu),更具體的樣式覆蓋通用樣式。樣式規(guī)則的優(yōu)先級由CSS根據(jù)這個層次結(jié)構(gòu)決定,從而實現(xiàn)級聯(lián)效果。
css的語言基礎(chǔ)
屬性
屬性的名字是一個合法的標(biāo)識符,它們是CSS語法中的關(guān)鍵字。一種屬性規(guī)定了格式修飾的一個方面。例如:color是文本的顏色屬性,而text-indent則規(guī)定了段落的縮進(jìn)。
要掌握一個屬性的用法,有六個方面需要了解。具體敘述如下:
?、僭搶傩缘暮戏▽傩灾?legal value)。顯然段落縮進(jìn)屬性text-indent只能賦給一個表示長度的值,而表示背景圖案的background.image屬性則應(yīng)該取一個表示圖片位置鏈接的值或者是關(guān)鍵字none表示不用背景圖案。
?、谠搶傩缘哪J(rèn)值(initial value)。當(dāng)在樣式表單中沒有規(guī)定該屬性,而且該屬性不能從它的父級元素那兒繼承的時候,則瀏覽器將認(rèn)為孩屬性取它的默認(rèn)值。
?、墼搶傩运m用的元素(Applies to)。有的屬性只適用于某些個別的元素,比如white-space屬性就只適用于塊級元素。white-space屬性可以取normal、pre和nowrap三個值。當(dāng)取normal的時候,瀏覽器將忽略掉連續(xù)的空白字符,而只顯示一個空白字符。當(dāng)取pre的時候,則保留連續(xù)的空白字符。而取nowrap的時候,連續(xù)的空白字符被忽略,而且不自動換行。
?、茉搶傩缘闹凳欠癖幌乱患壚^承(inherited)。
?、萑绻搶傩阅苋“俜种?percentage),那么該百分值將如何解釋。也就是百分值所相對的標(biāo)準(zhǔn)是什么。如margin屬性可以取百分值,它是相對于margin所存元素的容器的寬度。
?、拊搶傩运鶎俚拿浇轭愋徒M(media groups)。
屬性值
?、僬麛?shù)和實數(shù)
這和普通意義上的整數(shù)和實數(shù)沒有多大區(qū)別。在CSS中只能使用浮點小數(shù),而不能像其他編程語言那樣使用科學(xué)記數(shù)法表示實數(shù),即1.2E3在CSS中將是不合法的。下面是幾個正確的例子,整數(shù):128、-313,實數(shù):12.20、1415、-12.03。
?、陂L度量
一個長度量由整數(shù)或?qū)崝?shù)加上相應(yīng)的長度單位組成。長度量常用來對元素定位。而定位分為絕對定位和相對定位,因而長度單位也分為相對長度單位和絕對長度單位。
相對長度單位有:em——當(dāng)前字體的高度,也就是font.size屬性的值;ex——當(dāng)前字體中小寫字母x的高度;Dx——一個像素的長度,其實際的長度由顯示器的設(shè)置決定,比如在800木600的設(shè)置下,一個像素的長度就等于屏幕的寬度除以800。
另一一點值得注意的是,子級元素不繼承父級元素的相對長度值,只繼承它們的實際計算值。
?、郯俜?jǐn)?shù)量(percentages)
百分?jǐn)?shù)量就是數(shù)字加上百分號。顯然,百分?jǐn)?shù)量總是相對的,所以和相對長度量一樣,百分?jǐn)?shù)量不被子級元素繼承。
看過“css程序如何工作”的人還看了: