CSS語(yǔ)法和選擇器實(shí)例分析

本篇內(nèi)容介紹了“CSS語(yǔ)法和選擇器實(shí)例分析”的有關(guān)知識(shí)，在實(shí)際案例的操作過(guò)程中，不少人都會(huì)遇到這樣的困境，接下來(lái)就讓小編帶領(lǐng)大家學(xué)習(xí)一下如何處理這些情況吧！希望大家仔細(xì)閱讀，能夠?qū)W有所成！

CSS簡(jiǎn)介

css的英文全稱Cascading Style Sheets，中文叫層疊樣式表。它是用來(lái)表現(xiàn)HTML文件樣式的計(jì)算機(jī)語(yǔ)言。它不僅可以靜態(tài)地修飾網(wǎng)頁(yè)，還可以配合各種腳本語(yǔ)言動(dòng)態(tài)地對(duì)網(wǎng)頁(yè)各元素進(jìn)行格式化。

CSS的特點(diǎn)是為HTML標(biāo)記語(yǔ)言提供了一種樣式描述，定義了其中元素的顯示方式。它可以實(shí)現(xiàn)修改一個(gè)小的樣式更新與之相關(guān)的所有頁(yè)面元素。

CSS 語(yǔ)法

css的結(jié)構(gòu)是由選擇器，一條或多條聲明組成的。每條聲明是由屬性和屬性值組成的。屬性是你想要設(shè)置的樣式屬性（style attribute）。每個(gè)屬性有一個(gè)值。屬性和值被冒號(hào)分開(kāi)。聲明和聲明之間被分號(hào)分開(kāi)。

selector {property:value}

給大家舉個(gè)栗子，給h4添加字體顏色為紅色：

css樣式如下：

h4 {color:#f00;}

童靴們看上邊的栗子，h4就是選擇器，color為設(shè)置的樣式屬性，#f00是屬性值。

如果你想接著為h4添加樣式，直接在分號(hào)后邊寫(xiě)就可以，例如設(shè)置字號(hào)為24px;

h4 {color:#f00;font-size:24px;}

選擇器的分組

在網(wǎng)頁(yè)中，不免好多元素有相同的樣式，那么我們可以對(duì)選擇器進(jìn)行分組，使分組的元素分享同一組樣式。

p,h4{color:#f00;}

上面的例子，所有的p元素和h4元素字體顏色設(shè)置成紅色。

繼承

在CSS中，子元素可以繼承父元素屬性。

body中兩個(gè)子元素分別是h4和p,給body元素添加屬性，設(shè)置字體顏色為紅色。

給body添加color屬性

在瀏覽器中顯示：

子元素繼承父元素屬性

通過(guò)CSS繼承，h4元素和p元素繼承了父元素body的屬性。

“CSS語(yǔ)法和選擇器實(shí)例分析”的內(nèi)容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識(shí)可以關(guān)注億速云網(wǎng)站，小編將為大家輸出更多高質(zhì)量的實(shí)用文章！