首頁  >  文章  >  web前端  >  什麼是css(層疊樣式表)?

什麼是css(層疊樣式表)?

青灯夜游
青灯夜游原創
2019-05-17 09:26:035977瀏覽

CSS是Cascading Style Sheets(層疊樣式表)的縮寫,是一種用來表現HTML(標準通用標記語言的一個應用)或XML(標準通用標記語言的一個子集)等文件樣式的電腦語言。

CSS主要用於設定網站外觀,讓我們的網站更加絢麗,引人注目;不僅可以靜態地修飾網頁,還可以配合各種腳本語言動態地對網頁各元素進行格式化。

CSS 能夠對網頁中元素位置的排版進行像素級精確控制,支援幾乎所有的字體字號樣式,擁有對網頁物件和模型樣式編輯的能力。

CSS樣式表可以定義文字和其他HTML標記的顏色、大小和位置,而HTML檔案定義內容及其組織方式。把它們分開可以讓你改變配色方案,而不必重寫整個網站。

級聯則表示套用於父元素的樣式也會套用於父元素中的所有子元素。例如,設定正文的顏色將意味著正文中的所有標題和段落也將是相同的顏色。

指定和使用樣式

#包含web頁面或網站樣式表的主要方法有三種:

1、設定標籤的屬性,稱為內嵌樣式;

2、在HTML頭標記中使用c9ccee2e6ea535a969eb3f532ad9fe89標記,稱為嵌入式樣式;

3、建立並連結到外部CSS文件,稱為外部樣式表。

基本樣式表通常會修改html標記的外觀,如6c04bd5ca3fcae76e30b72ad730ca86d和e388a4556c0f65e1904146cc1a846bee。在頭檔中使用CSS檔案或樣式表時,我們也可以定義樣式類,並使用class="?"屬性將它們套用到任何元素,但這超出了本簡單指南的範圍。

內聯樣式

特點:

1)、內聯樣式放在程式碼中的HTML元素中。

2)、使用內聯樣式時,樣式只會影響你所選擇的元素。

3)、內聯樣式沒有選擇器

附註:HTML中定義的內聯樣式只適用於它們所新增的標記。

<p style="color:red;">Some red text</p>

嵌入式樣式

特點: 

1)、被放置在樣式標籤b30f827a0e5111390c73b8acc2f509d7 e90442d4aba9b6409c93259f982d1eec所寫的網頁的頭部部分中。

2)、編寫的樣式將只用於您使用它的網頁。

3)、嵌入樣式也稱為「內部樣式」

標題中定義的樣式將會套用到整個頁面。下面的範例將使頁面中的所有h1標記都以紅色顯示標題。

<head>
   <style type="text/css"> 
       h1 { color: red; }
   </style>
</head>

外部樣式表

與HTML檔案一樣,CSS檔案也是純文本,並且通常具有.css檔案副檔名;可以透過特定的標籤來將其連結到HTML檔案中。

特點:

1)、在單獨的文檔中編寫然後附加到各種Web文檔中

2)、修改它可以影響所有你所呼叫的頁面

3)、方便修改操作

例如,style.css檔案內容可以如下所示:

body { background-color: beige; color: #000080;}
h1 { color: red;}

然後可以使用be98b57125ed9b2d8fbe917c785e8d94在header頭中引入生效。

<head>
<link rel="stylesheet" type="text/css" href="style.css" title="style">
</head>

如今大多數網站使用外部樣式表,外部樣式是在單獨的文檔中編寫然後附加到各種Web文檔的樣式。外部樣式表會影響它們所連接的任何文件,這意味著如果你有一個20頁的網站,每個頁面使用相同的樣式表,當需要改變的話只需編輯該樣式表即可完成這些頁面,這使得長期站點管理變得更加容易。外部樣式表的缺點是它們需要頁面來取得和載入這些外部檔案。並非每個頁面都會使用CSS表格中的每個樣式,因此許多頁面將載入比實際需要的頁面大得多的CSS頁面。

以上是什麼是css(層疊樣式表)?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn