使用 fontawesome 格式化 css

Question

你好我的软件开发朋友们。

<!DOCTYPE html>
<html>
<head>


<title>PostmodernCast</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">


</head>
<body>

<i class="fab fa-accessible-icon"></i>

</body>
</html>

如何将此处的 fab fa-accessible-icon 内容格式化为 css。因为

.fab fa-accessible-icon{ width:100px; border-radius:100px}

不像

Answer 1

要首先更改 fontawesome 图标，您应该 select 它是正确的。以 i 标签开头，然后是要更改的图标的 class。现在，此代码有效。

 i.fa-accessible-icon { 
     width:100px;
     border-radius:100px;  
     font-size: 1.5rem
    }

例子

i.fa-accessible-icon {
  width: 100px;
  border-radius: 100px;
  font-size: 3.5rem;
  padding-left: 15px;
  background-color: blue;
  color:red;
}

<!-- fontawesome-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css" integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog==" crossorigin="anonymous" />


<i class="fab fa-accessible-icon"></i>

使用 fontawesome 格式化 css

Formatting with fontawesome css

html

css

font-awesome