NOVINKA: Získej 40 hodin praktických dovedností s AI – ZDARMA ke každému akreditovanému kurzu!
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.

Diskuze – Galerie CSS3 tlačítek

Zpět

Upozorňujeme, že diskuze pod našimi online kurzy jsou nemoderované a primárně slouží k získávání zpětné vazby pro budoucí vylepšení kurzů. Pro studenty našich rekvalifikačních kurzů nabízíme možnost přímého kontaktu s lektory a studijním referentem pro osobní konzultace a podporu v rámci jejich studia. Toto je exkluzivní služba, která zajišťuje kvalitní a cílenou pomoc v případě jakýchkoli dotazů nebo projektů.

Komentáře
Avatar
Samuel Kodytek
Tvůrce
Avatar
Samuel Kodytek:11.6.2014 22:41

Odkazy nefugují ;(

Odpovědět
11.6.2014 22:41
There is more than one way to screw it
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
Odpovídá na Samuel Kodytek
Michal Žůrek - misaz:12.6.2014 6:32

tlačítka si můžeš stáhnout

 
Odpovědět
12.6.2014 6:32
Avatar
luko8525
Člen
Avatar
luko8525:27.7.2014 15:24

Máte tu chybu... :`

Odpovědět
27.7.2014 15:24
Prišiel som, videl som, ostal som!
Avatar
David Hartinger
Vlastník
Avatar
Odpovídá na luko8525
David Hartinger:27.7.2014 22:34

Opraveno :)

Odpovědět
27.7.2014 22:34
New kid back on the block with a R.I.P
Avatar

Člen
Avatar
:8.11.2014 7:35

Kam můžu uvést autora čudlíků ? :-) Nevím ani kam uvést sebe :-). Jinak moc krásný tlačítka děkuji

 
Odpovědět
8.11.2014 7:35
Avatar

Člen
Avatar
:8.11.2014 8:25

Mám dotázek, jakpa změním barvu prvních tlačítek od Hobi, chtěl bych oranžovou a okraje šedivé :o), děkují moc autora tam přidám až na to přijdu nemějte mi to za zlé pokud tam zatím nebude jsem začátečník :-) ale moc mě to baví

 
Odpovědět
8.11.2014 8:25
Avatar
Honza Bittner
Tvůrce
Avatar
Odpovídá na
Honza Bittner:8.11.2014 9:50

Tlačítko vytváří třída .uni - tu si zkopíruj. Poté na ní je třída s barvou - například .blue, která má i hover. Pro blue tu jsou tyto styly:

.blue{
background: radial-gradient(circle, #17A7BD, #17A7BD);
}

.blue:hover{
background: background: radial-gradient(circle, #38c8ee 10%, #17A7BD 100%);
}

Stačí si udělat tedy svou třídu s barvou - .black .white či tak nějak a nastavit jí na tlačítko. :)

Odpovědět
8.11.2014 9:50
FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.
Avatar

Člen
Avatar
:8.11.2014 12:58

supr děkují :-))

 
Odpovědět
8.11.2014 12:58
Avatar
Saly
Člen
Avatar
Saly:27.1.2015 15:53

Takový dotaz tlačítka Misaz když zazoomujete chrome (CTRL+ +) tak zmizí pozadí ... nevíte jak to opravit ??

 
Odpovědět
27.1.2015 15:53
Avatar
Leon Corn
Člen
Avatar
Leon Corn:9.6.2016 15:18

<!DOCTYPE>
<html>
<head>
<link href="http://­fonts.googlea­pis.com/css?fa­mily=Press+Star­t+2P&subset=la­tin,greek,latin-ext,cyrillic" rel="stylesheet" type="text/css">
<meta charset="utf-8">
<title>Tech-OS</title>
<style>
@font-face {
font-family: 'press_start_2pre­gular';
src: url('pressstart2p-webfont.eot');
src: url('pressstart2p-webfont.eot?#i­efix') format('embedded-opentype'),
url('pressstart2p-webfont.woff') format('woff'),
url('pressstart2p-webfont.ttf') format('truetype'),
url('pressstart2p-webfont.svg#pres­s_start_2pregu­lar') format('svg');
font-weight: normal;
font-style: normal;

}

button{
height:35px;
width:125px;
border:none;

  • webkit-box-shadow:0px 14px 0px 0px #8A8686;
  • moz-box-shadow:0px 14px 0px 0px #8A8686;

box-shadow:0px 14px 0px 0px #8A8686;
font-family:'press_star­t_2pregular';
font-size:16px;
background-color:#A6A1A1;
}
button:hover{
color:#FFFFFF;
cursor:pointer;
}
button{
height:35px;
width:125px;
border:none;

  • webkit-box-shadow:0px 14px 0px 0px #8A8686;
  • moz-box-shadow:0px 14px 0px 0px #8A8686;

box-shadow:0px 14px 0px 0px #8A8686;
font-family:'press_star­t_2pregular';
font-size:16px;
background-color:#A6A1A1;
}
button:hover{
color:#FFFFFF;
cursor:pointer;
}
button:active{
margin-top:7px;

  • webkit-box-shadow:0px 7px 0px 0px #7C7979;
  • moz-box-shadow:0px 7px 0px 0px #7C7979;

box-shadow:0px 7px 0px 0px #7C7979;
cursor:pointer;
}

</style>
</head>
<body>
<a href="https:/­/www.google.cz/?gws_rd=­ssl"><button type="button" onclick=>GOOG­LE!</button></a>

</body>
</html>

A tady je návod jak to použít v html
nemám autorské práva, tak nemůžu psát články, ale vysvětlit vám to muže někdo odsud, nebo pište do zpráv.

Editováno 9.6.2016 15:19
 
Odpovědět
9.6.2016 15:18
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 10 zpráv z 27.