React Logo

我們將介紹如何在 React 應用程式中新增 logo。

在 React 中新增 Logo

如今，每個網站都有其 Logo 和影象。

當我們構建一個 React 應用程式時，我們首先要更改 Logo，而有些人發現在 React 應用程式中顯示影象很困難。我們將討論使用簡單程式碼在 React 應用程式中顯示你的 Logo。

首先，我們將把我們的 logo 儲存在 src 資料夾中。一旦我們儲存了我們的標誌，現在我們將把它匯入我們想要顯示它的檔案中。

使用以下程式碼匯入 Logo。

# react 
import logo from './logo.svg';

一旦我們將 Logo 匯入到要顯示它的頁面中，我們將為它建立一個檢視。

# react
<img src={logo} className="App-logo" alt="logo">

在提供的程式碼中，我們可以看到在 src 屬性中，我們呼叫了一個變數 {logo}。此變數將輸出我們匯入的 Logo 的 URL。

我們將編寫 CSS 程式碼以根據需要調整 Logo 的大小。

# react
.App-logo{
    width: 150px;
}

讓我們檢查一下我們的 Logo。

輸出：

我們現在已經學會了如何在 React 應用程式中輕鬆地顯示我們的影象或 Logo。