Python týden ITnetwork summer 2020
Pouze tento týden sleva až 80 % na e-learning týkající se Pythonu
80 % bodů zdarma na online výuku díky naší Letní akci!

Borders (rámečky) - Český CSS3 manuál

S nástupem CSS3 můžete využívat zakulacených rámečků, přidat vlastní stín nebo i jako rámeček použít obrázek bez užití grafických programů.

Obecně - Podpora prohlížečů

  • IE9 podporuje jen velmi málo nových vlastností
  • U ostatních prohlížečů je vyžadován prefix
    • Firefox -moz-vlastnost
    • Chrome, Safari -webkit-vlastnost
    • Opera -o-vlastnost
    • IE9 -ms-vlastnost

CSS3 Zaoblené rohy (border-radius)

Tento výukový obsah pomáhají rozvíjet následující firmy, které dost možná hledají právě tebe!

Příkladné použití na divu:

div
{
        border: 2px solid;
        border-radius: 25px;
}

CSS3 Vržení stínu (box-shadow)

Příkladné použití na divu:

div
{
        box-shadow: 10px 10px 5px #888888;
}

CSS3 Obrázek jako rámeček (border-image)

Příkladné použití pro div s rozkopírováním obrázku okolo.

div
{
        border-image: url(ramecek.png) 30 30 round;
        -moz-border-image: url(ramecek.png) 30 30 round; /* Firefox */
        -webkit-border-image: url(ramecek.png) 30 30 round; /* Safari a Chrome */
        -o-border-image: url(ramecek.png) 30 30 round; /* Opera */
}

 

Všechny články v sekci
Rámeček - CSS vlastnosti
Článek pro vás napsal David Jančík
Avatar
Autor je vášnivý programátor. Nezná slovo "nelze", nebojí se zkoušet nepoznané a pronikat do nových technologií.
Aktivity (1)

 

 

Komentáře

Avatar
KlimiCZ
Člen
Avatar
KlimiCZ:14.4.2014 20:05

jde to použít i v php jako že volám funkci ktera ma echo a dá se do rámečku ?

Odpovědět
14.4.2014 20:05
Nesnaž se zakrýt něco, co jsi provedl úmyslně. Svět je tak malý, že dotyčný se to stejně dozví.
Avatar
Odpovídá na KlimiCZ
Michal Štěpánek:14.4.2014 21:20

Použití CSS přeci nebrání jazyk, který použiješ na tvorbu webu...

Odpovědět
14.4.2014 21:20
Nikdy neříkej nahlas, že to nejde. Vždycky se totiž najde blbec, který to neví a udělá to...
Avatar
KlimiCZ
Člen
Avatar
Odpovídá na Michal Štěpánek
KlimiCZ:15.4.2014 7:41

a jak by se to udělalo já to mám takhle :

echo "<p class=ramecek>Jsi náš ".$pocet.". návštěvník </p>";

a jenom to napíše text

Odpovědět
15.4.2014 7:41
Nesnaž se zakrýt něco, co jsi provedl úmyslně. Svět je tak malý, že dotyčný se to stejně dozví.
Tento výukový obsah pomáhají rozvíjet následující firmy, které dost možná hledají právě tebe!
Avatar
Honza Bittner
Šupák
Avatar
Odpovídá na KlimiCZ
Honza Bittner:15.4.2014 8:03

Tak zaprvé se html elementy s třídou zapisují takto:

<element class="trida">text</element>

A samozřejmě že ti to pak ostyluje podle tvého stylu pro .trida nebo element...

Odpovědět
15.4.2014 8:03
Student FIT ČVUT. In love with Flutter. :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://g...
Avatar
Odpovídá na KlimiCZ
Michal Štěpánek:15.4.2014 9:43

Jak píše Honza, jest třeba používat uvozovky a co je hlavní, musíš mít v CSS ten tvuj "ramecek" nastaven, tzn. popsat, co má dělat, jinak se nemá co aplikovat...

Odpovědět
15.4.2014 9:43
Nikdy neříkej nahlas, že to nejde. Vždycky se totiž najde blbec, který to neví a udělá to...
Avatar
KlimiCZ
Člen
Avatar
Odpovídá na Michal Štěpánek
KlimiCZ:15.4.2014 10:39

už to funguje
byla chyba v přenosu dat :D

Odpovědět
15.4.2014 10:39
Nesnaž se zakrýt něco, co jsi provedl úmyslně. Svět je tak malý, že dotyčný se to stejně dozví.
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 6 zpráv z 6.