css樣式表詳解ppt課件-資料下載頁(yè)
2025-05-05 12:06本頁(yè)面
【正文】 使用“定位”文本框中輸入的、相對(duì)于最近的絕對(duì)或相對(duì)定位上級(jí)元素的坐標(biāo)（如果不存在絕對(duì)或相對(duì)定位的上級(jí)元素，則為相對(duì)于頁(yè)面左上角的坐標(biāo)）來放置內(nèi)容。 相對(duì)：使用“定位”文本框中輸入的、相對(duì)于區(qū)塊在文檔文本流中的位置的坐標(biāo)來放置內(nèi)容區(qū)塊。例如，若為元素指定一個(gè)相對(duì)位置，并且其上坐標(biāo)和左坐標(biāo)均為 20px，則將元素從其在文本流中的正常位置向右和向下移動(dòng) 20px。也可以在使用（或不使用）上坐標(biāo)、左坐標(biāo)、右坐標(biāo)或下坐標(biāo)的情況下對(duì)元素進(jìn)行相對(duì)定位，以便為絕對(duì)定位的子元素創(chuàng)建一個(gè)上下文。 固定：使用“定位”文本框中輸入的坐標(biāo)（相對(duì)于瀏覽器的左上角）來放置內(nèi)容。當(dāng)用戶滾動(dòng)頁(yè)面時(shí)，內(nèi)容將在此位置保持固定。 靜態(tài)：將內(nèi)容放在其在文本流中的位置。這是所有可定位的 HTML元素的默認(rèn)位置。 定位 返回本節(jié) 2．顯示 確定內(nèi)容的初始顯示條件。相對(duì)應(yīng)的 CSS屬性是 visibility。如果不指定“顯示”屬性，則默認(rèn)情況下內(nèi)容將繼承父級(jí)標(biāo)簽的值。 body標(biāo)簽的默認(rèn)可見性是可見的?！帮@示”下拉列表中包括 3個(gè)選項(xiàng)。 繼承（默認(rèn)）：繼承內(nèi)容的父級(jí)可見性屬性。 可見：將顯示內(nèi)容，而與父級(jí)的值無關(guān)。 隱藏：將隱藏內(nèi)容，而與父級(jí)的值無關(guān)。 3． Z 軸 確定內(nèi)容的堆疊順序。 Z軸值較高的元素顯示在 Z軸值較低的元素（或根本沒有Z 軸值的元素）的上方。值可以為正，也可以為負(fù)。 4．溢出 確定當(dāng)容器（如 DIV或 P）的內(nèi)容超出容器的顯示范圍時(shí)的處理方式?！耙绯觥毕吕斜碇邪?4個(gè)選項(xiàng)。 可見：將增加容器的大小，以使其所有內(nèi)容都可見。容器將向右下方擴(kuò)展。 隱藏：保持容器的大小并剪輯任何超出的內(nèi)容。不提供任何滾動(dòng)條。 滾動(dòng)：將在容器中添加滾動(dòng)條，而不論內(nèi)容是否超出容器的大小。明確提供滾動(dòng)條可避免滾動(dòng)條在動(dòng)態(tài)環(huán)境中出現(xiàn)和消失所引起的混亂。 自動(dòng)：將使?jié)L動(dòng)條僅在容器的內(nèi)容超出容器的邊界時(shí)才出現(xiàn)。 定位 返回本節(jié) 5．定位 指定內(nèi)容塊的位置和大小，包括上、下、左、右 4個(gè)選項(xiàng)。瀏覽器如何解釋位置取決于“類型”設(shè)置。如果內(nèi)容塊的內(nèi)容超出指定的大小，則將改寫大小值。 位置和大小的默認(rèn)單位是像素。還可以指定以下單位： pc（皮卡）、pt（點(diǎn)）、 in（英寸）、 mm（毫米）、 cm（厘米）、 em（全方）、（ ex）或 %（父級(jí)值的百分比）。單位縮寫字母必須緊跟在值之后，中間不留空格。例如， 3mm 。 6．剪輯 定義內(nèi)容的可見部分，包括上、下、左、右 4個(gè)選項(xiàng)。如果指定了剪輯區(qū)域，可以通過腳本語言（如 JavaScript）訪問它，并使用“改變屬性”行為可以設(shè)置擦除效果。 擴(kuò)展 返回本節(jié) 擴(kuò)展選項(xiàng)中的 CSS屬性包括分頁(yè)、光標(biāo)和過濾器（濾鏡效果）選項(xiàng)。如圖 418所示。 圖 418 擴(kuò)展選項(xiàng) 擴(kuò)展 返回本節(jié) 1．分頁(yè) 打印網(wǎng)頁(yè)時(shí)，在樣式所控制的對(duì)象之前或者之后強(qiáng)行分頁(yè)。下拉列表中包括 4個(gè)選項(xiàng)：自動(dòng)、總是、左對(duì)齊和右對(duì)齊。 2．光標(biāo) 當(dāng)鼠標(biāo)指針位于樣式所控制的對(duì)象上時(shí)改變鼠標(biāo)指針的外觀?！肮鈽?biāo)”下拉列表中包括一些具體的選項(xiàng)，選擇后可以改變鼠標(biāo)指針的視覺效果。 3．過濾器 對(duì)樣式所控制的對(duì)象應(yīng)用特殊效果（包括模糊和反轉(zhuǎn)等濾鏡效果）?！斑^濾器”下拉列表中包括一些具體的選項(xiàng)，這些效果應(yīng)用到網(wǎng)頁(yè)中元素上后，可以得到一種類似于 Photoshop的濾鏡效果。 ? 內(nèi)部樣式表 ? 外部樣式表 返回本章首頁(yè) 創(chuàng)建 CSS樣式 在需要設(shè)置單個(gè)頁(yè)面的格式時(shí)，可以使用內(nèi)部樣式表 —— 保存在網(wǎng)頁(yè)文檔內(nèi)部的樣式表。在需要同時(shí)控制多個(gè)文檔的外觀以便在多個(gè)頁(yè)面上實(shí)現(xiàn)統(tǒng)一的格式時(shí)，可以使用外部樣式表，這是保存在網(wǎng)頁(yè)文檔外部的樣式表，它被鏈接到當(dāng)前頁(yè)面。 內(nèi)部樣式表 返回本節(jié) 內(nèi)部樣式是那些定義來只使用當(dāng)前文檔的樣式。如果用戶想定義只在自己站點(diǎn)的一個(gè)頁(yè)面中使用的樣式，就可以使用內(nèi)部樣式。 例 61(原始網(wǎng)頁(yè) ) 例 61 CSS 外部樣式表 返回本節(jié) 內(nèi)部樣式表只在一個(gè)網(wǎng)頁(yè)中起作用，如果想制作很多具有統(tǒng)一樣式的網(wǎng)頁(yè)，就必須在每個(gè)網(wǎng)頁(yè)內(nèi)定義相同的 CSS樣式表。這樣很麻煩，效率也很低。外部 CSS樣式表能夠較好地解決這個(gè)問題。具體實(shí)現(xiàn)方法是，先建立一個(gè)外部 CSS樣式表文件，在這個(gè)文件中定義文字、段落、表格、超級(jí)鏈接等網(wǎng)頁(yè)元素的樣式。然后在需要的網(wǎng)頁(yè)上鏈接這個(gè)外部 CSS樣式表文件即可。 下面通過實(shí)例介紹外部 CSS樣式表的創(chuàng)建及應(yīng)用的方法。 原始網(wǎng)頁(yè) 1． 創(chuàng)建外部 CSS樣式表 2． 鏈接外部 CSS樣式表 結(jié)束放映 返回本章首頁(yè)
教學(xué)課件相關(guān)推薦
鄂ICP備17016276號(hào)-1