Latest web development tutorials

CSS3 Granicznej

CSS3 Granicznej

Z CSS3, można utworzyć zaokrąglone narożniki, dodać pole cienia, a jako obraz granicy bez korzystania z programów projektowych, takich jak Photoshop.

W tym rozdziale dowiesz się następujące właściwości granicznych:

  • border-radius
  • box-shadow
  • border-image

CSS3 zaokrąglone narożniki

Dodaj filety trudnych w CSS2. Musieliśmy użyć innego obrazu każdym rogu.

W CSS3, to jest bardzo łatwe do tworzenia zaokrąglone narożniki.

W CSS3 Własność border-radius jest używany do tworzenia zaokrąglone narożniki:

To jest zaokrąglana granic!

Przykłady

Dodaj filety w elemencie div:

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

Spróbuj »

cienie box CSS3

Nieruchomość CSS3 box-shadow służy do dodawania cienia:


Przykłady

Dodaj właściwość box-shadow w div

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

Spróbuj »

zdjęcia CSS3 border

Z własności CSS3 border-obrazu, można użyć obrazu, aby stworzyć granicę:

Własność border-image pozwala określić obraz jako granicy! Służy do tworzenia granicę powyżej oryginalnego obrazu:

Za pomocą zdjęć, aby utworzyć div granicę:

granica

Przykłady

Za pomocą zdjęć, aby utworzyć div granicznego

div
{
border-image:url(border.png) 30 30 round;
-webkit-border-image:url(border.png) 30 30 round; /* Safari 5 and older */
-o-border-image:url(border.png) 30 30 round; /* Opera */
}

Spróbuj »

Nowe właściwości graniczne

nieruchomość wyjaśnienie CSS
border-image Ustawianie właściwości border skróconą wszystkich obrazów. 3
border-radius Jeden ustawiania wszystkich czterech granicę - * - Obiekt Promień skrótowym 3
box-shadow Dołączyć jedną lub więcej cieni listy rozwijanej 3