之前的文章給大家介紹了下網頁中常用的html的基本知識，從這篇文章開始我們開始介紹css的內容。可以這麼說學完了html你可以做出網頁的框架，學好了css之後呢，你就可以給做好的框架進行美化填色，做出各種各樣的網頁。本篇文章先帶大家認識一下css的概念與語法，瞭解一下css的優勢之處。

如果有想一起學習web前端，HTML5及JavaScript的可以來一下我的前端群733581373，好友都會在裡面交流，分享一些學習的方法和需要注意的小細節，每天也會準時的講一些前端的炫酷特效，及前端直播課程學習

1）css的概念與語法

CSS全稱為“層疊樣式表 (Cascading Style Sheets)”，它主要是用於定義

使用語法：

詳細講解：

1、選擇符：又稱選擇器，指明網頁中要應用樣式規則的元素，如我們想要讓網頁中所有p標籤中的文字變成紅色，那麼我們只需要選擇標題對應的標籤就行設定即可。

2、宣告：在英文大括號“｛｝”中的的就是宣告，屬性和值之間用英文冒號（：）分隔。當有多條宣告時，中間可以英文分號 （；） 分隔。

我們再瀏覽器中顯示的樣式就如下所示：（我們所設定標籤中的字型已經變成了紅色了）

書寫格式：css的程式碼寫法有兩種可以將程式碼寫在一行裡，使用分號（；）隔開，也可以為了更容易閱讀，每條程式碼佔一行。我們css中的註釋程式碼是使用兩個反斜槓和兩個星來包含，中間寫註釋的內容（/* 註釋的內容 */），註釋的內容在網頁中是不顯示的，具體見下圖所示：

2）css的優勢

那麼我們為什麼要使用css樣式來設定網頁的外觀樣式呢？它對我們來說到底有什麼好處和便利嗎？我們接下來看下面一個例子就能很清楚的瞭解css的作用了。

首先呢我們先寫很長很長的一篇文章，然後呢我們的文章中有很多的一樣的文字比如：“恆創資訊”，“愛上寫程式碼”，“關注我們”，如果我們想把這幾個文字統一都設為紅色，字型為16px，並且加粗，這時就可以通過設定樣式來修改其字型顏色以及字型大小，而且只需要編寫一條css樣式語句就可以實現。具體的程式碼就如下圖所示：

我們再網頁中顯示的效果就如下圖所示：

由此可以看出，我們只需要設定一個標籤的樣式，我們就可以控制很多文字的顏色、大小等樣式，是不是很方便呢，想一想都還有那些地方可以統一使用樣式來控制呢。

這篇文章我們就先說到這裡，下一篇我們會介紹大家如何在網頁中引用css的樣式，它有3種不同的引用方式。另外一定要自己親自動手寫一寫，這樣對自己才有提升，技術才能不斷的進步。

每日金句：艱苦是面臨，挫折是經驗，努力是橋樑，成功是彼岸。喜歡我的文章的小夥伴記得關注一下哦，每天將為你更新最新知識。

最後，如果有想一起學習web前端，HTML5及JavaScript的可以來一下我的前端群733581373，好友都會在裡面交流，分享一些學習的方法和需要注意的小細節，每天也會準時的講一些前端的炫酷特效，及前端直播課程學習

如果想看到更加系統的文章和學習方法經驗可以關注的微訊號：‘web前端技術圈’或者‘webxh6’關注後回覆‘2018’可以領取一套完整的學習視訊