在學習react框架之前，許多人應該已經熟悉了如何在html檔案中使用css樣式，這裡再作一下說明，css樣式分為3種形式：
1、內聯式（行內樣式） 直接在標籤內部宣告樣式
測試文字
2、嵌入式（內部樣式） 通過標籤名、class或id等方法與標籤聯絡起來設定樣式
3、外聯式（外部樣式） 通過引入外部檔案來設定樣式
但是，在我們的react專案中採用的是虛擬dom，元件也是放在乙個個的js檔案中，所以css的使用和引入方式就略有不同。下面通過例項來進行介紹。
這是在之前的文章中搭建完的react專案，各位也可以自行建立。下面的例項將在page1這個元件中進行。
首先來檢視page1的內容：
import
react
from
'react';
class
page1
extends
react
.component }
export
default
page1
;使用 npm start 啟動專案後，page1元件顯示如下：
下面將來更改this is page1!
這一標籤的樣式，與html中不同，在react專案中新增css樣式的寫法如下：
this is page1!
檢視上方語句，style=後面跟著的是兩對大括號，與原本的style=" color:red; font-size:16px "不同。而且樣式名稱的命名方式也有所不同，由本來的 font-size 變成了 fontsize，採用了單駝峰式的命名形式（前面單詞小寫，後面單詞大寫開頭）其他的樣式名稱也用同樣的方式來更改，比如用 backgroundcolor 來替代 background-color。然後把等號右邊的 16px 加上了引號，作為乙個字串傳入。不同樣式字段之間用逗號隔開而不是分號。有些編輯器會自動提示js檔案中的樣式書寫規範，各位也可以參照網上的一些資料。
現在通過這一方式來對page1頁面進行樣式修改，**如下：
import
react
from
'react';
class
page1
extends
react
.component}
>
this is page1!
div>
div>
); } }
export
default
page1
;為了方面讀**，把這個div標籤寫成上述形式，良好的**書寫習慣有助於**理解和維護，怎麼看舒服怎麼寫。
然後，我們來檢視 localhost:3000/page1 （因專案而異）中的內容：
之前寫的css樣式被應用在了頁面上。
那麼，還有沒有其他方式來引入css樣式。
我們可以將css樣式作為乙個物件來引入，該物件的屬性就對應著css樣式屬性，我們刪去上文例子中的樣式，建立乙個名稱為mystyle的物件：
import
react
from
'react';
class
page1
extends
react
.component
return(
<
div>
<
divstyle
=>
this is page1!
div>
div>
); } }
export
default
page1
;上面**中在元件的render函式裡建立了乙個mystyle物件，屬性為css樣式的內容，在下方標籤中的style屬性中引入mystyle物件（注意，這裡只有一層大括號），頁面呈現的內容同樣使用了css樣式：
那麼，能否從外部匯入css檔案呢，首先我們在同級目錄下建立乙個 mystyle.css 檔案，內容如下：
#mydiv
刪去page1元件中定義的樣式，並給標籤新增 id='mydiv'：
import
react
from
'react'
; require
('./mystyle.css');
class
page1
extends
react
.component }
export
default
page1
;儲存兩個檔案後，就可以在頁面中看到css樣式生效的內容：
HTML學習（四）樣式
通過使用 html4.0，所有的格式化 均可移出 html 文件，然後移入乙個獨立的樣式表。例項 例1 本例演示如何使用新增到 a paragraph.例2 本例演示如何使用樣式屬性做乙個沒有下劃線的鏈結。這是乙個鏈結！我也一樣！當瀏覽器讀到乙個樣式表，它就會按照這個樣式表來對文件進行格式化。有以下...
JQuery知識快覽之四 樣式
前面我們獲取了物件集，本文介紹怎麼控制物件集的樣式 在乙個html頁面中，我們有兩種方式來控制乙個物件的樣式，用html attribute控制，或者用css類來控制，這兩種方法雖然都能控制物件的樣式，但是通過css來控制物件的樣式，將內容和呈現分離開來是更為推薦的一種方法。jquery提供了豐富的...
CSS學習筆記 三 樣式宣告
在這篇文章中你能看到有關於 css 樣式設定的常用屬性 1 背景顏色 可以使用background color屬性為元素設定背景顏色，它接受任何合法的顏色值，預設是transparent 注意，background color 屬性不能繼承 2 背景 可以使用background image屬性為元...