简体   繁体   中英

How do I make a Bootstrap Icon appear?

I am new to Bootstrap and I'm building a login screen for an app. I want to use the the MDBIcons for google, twitter and facebook. I followed the documentaion here https://mdbootstrap.com/docs/b5/react/components/buttons/

However, when I view my webpage I can't see the icons. I only a small button in the color of the brand. My code for the google icon button looks like this

import "./App.css";
import React from "react";
import {  MDBIcon,  MDBBtn } from 'mdb-react-ui-kit';
 
const SignIn = () => {
  return (
    <>

      <MDBBtn
              className="m-1"
              style={{ backgroundColor: "#dd4b39" }}
              href="#"
            >
              <MDBIcon fab icon="google" />
            </MDBBtn>
    </>
  );
};

按钮照片

The picture above is what I see, there is no Google logo in the button. I am using React and running 'npm start' to view my webpage on chrome.

Any help would be appreciated.

Did you add style in the public/index.html file? Info about it is here. React MDB Installation Guide .

I mean this:

link href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet"/>

If not, try adding this into your index.html file's "head" section.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM