HTML разные стили кнопок - как шестеренка - PullRequest
Новая
       10

HTML разные стили кнопок - как шестеренка

0 голосов
/ 14 ноября 2018

У меня есть кнопка под названием «настройка», и я хочу, чтобы эта кнопка была похожа на шестерню. Я нашел это: https://www.toptal.com/designers/htmlarrows/symbols/gear/ И это: https://www.w3schools.com/icons/tryit.asp?filename=tryicons_fa-gear

Но они не работают над моим угловым / электронным проектом.

Это текущая кнопка (обычная): 

<button class="flex-buttons"  class="form-control settings">Settings</button>

Большое спасибо!

Ответы [ 2 ]

0 голосов
/ 14 ноября 2018

Google сам предоставляет список значков, попробуйте использовать это. 

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
</head>
<body>

<i class="material-icons">settings</i>
<i class="material-icons" style="font-size:24px;">settings</i>
<i class="material-icons" style="font-size:40px;color:red;">settings</i>
<i class="material-icons" style="font-size:60px;color:green;">settings</i>

</body>
</html>
0 голосов
/ 14 ноября 2018

Вам нужно загрузить <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> в index.html, чтобы иметь возможность использовать классы шрифтов, такие как 'fa fa-gear', как во втором примере.

...