React-[入門篇]-在JSX中加入inline style樣式 | 引入 external css 檔案


{{}}夾心餅乾的inline style

如果要在元件中的JSX區塊加入inline style會需要寫入js 物件的方式,首先:

inline style的設定就是物件的{key: value}寫法

因為是js物件,所以key是採取小駝峰寫法


也可以定義好再寫入

import external CSS檔案

已有寫好現成的css檔案,要在使用的元件檔案中上放用import Css檔案所在的位置(很重要的動作)

注意:這裡的css style是全域css檔案/global styles,並不是scoped to 每一個元件,這在小的app開發不是問題,通常我們在大的開發會使用styled components為主(一個css檔只限於一個元件)

#React入門 #inline style&js&js object







你可能感興趣的文章

串接 API -- block-scoped 問題

串接 API -- block-scoped 問題

Week3 - 挑戰題:走迷宮

Week3 - 挑戰題:走迷宮

使用 Matter.js 2D 物理引擎製作動畫

使用 Matter.js 2D 物理引擎製作動畫






留言討論