За уеб разработчици по-добре да се намали използването на изображения до минимум, например чрез използване на икони за бутоните, които са създадени само с CSS. Подобни икони са много, много, те се добавят към кода на CSS във формата на шестнадесетични стойности. Тези кодове за икони могат да бъдат намерени на различни места, ето няколко места, които са били използвани за създаването на този урок:
В тези списъци, ние бяхме в състояние да се намери друг код, който може да бъде полезен на уеб-сайта.
Сега, след като сте избрали съответните символи, ние ще ви покажем как да ги поставите на мига, като се използват само CSS код и псевдо: преди да добавите съдържание към елемент клас.
Създаване на бутон
Първо трябва да се създаде един бутон. В този пример като бутон приема нормално правоъгълник със заоблени ъгли, създадени от CSS3.
Копирайте CSS кода на бутона по-долу:
Добавянето на псевдо: преди
След като сме създали един бутон, трябва да добавим псевдо: преди, за да бъде в състояние да добавите бутон съдържание.
Всичко сега е нужно - за да добавите външна и вътрешна подложка за поставяне псевдо: преди правилно.
Копирайте CSS кода по-долу, за да псевдо: преди:
Сега, за да се сложи икона върху бутона, ние трябва да добавите в кода на собствеността CSS съдържание.
Чрез определянето на съдържанието на псевдо-клас имота: преди, можем да създадем нови CSS класове за различни герои, които искаме да използваме.
По-долу са различните икони, които ние открихме интересни за по чисти бутони CSS.
с формите на бутоните
Бътън, Добавяне, редактиране, изтриване, Save, Letter, Крос.
Тук са най-бутони, които могат да бъдат използвани, за да образува
с бутони валута
Ако искате да покажете символи за валута на бутоните:
Бутоните с температура
За да се покаже на героите за температурата на Целзий и Фаренхайт:
Бутони с математически символи
Pi, една трета, две трети, една пета, две пети, три пети, четири пети, една шеста, пет шести, осми, три осми, пет осми, седем осми от една четвърт, половин, три четвърти.
Има много на математически символи, са тези, които открихме полезен:
Бутони със стрелки
Стрелката на ляво, стрелка нагоре, стрелка надясно, стрелка надолу, стрелка наляво и нагоре, надясно стрелка нагоре, надолу стрелка наляво, надясно стрелка надолу-нататък.
Можете да използвате различни видове стрели:
Бутоните с различни символи
Икони много, ние открихме интересни са:
Виж за демонстрация на страницата. как икони се показват в браузъра.
Свързани статии