• Wpisów: 315
  • Średnio co: 8 dni
  • Ostatni wpis: 1 rok temu, 13:44
  • Licznik odwiedzin: 457 849 / 2529 dni
 
testowo
 
Czas zajac sie obramowaniami avatarow-czyli ramkami...
O obramowaniach pisalem juz w lekcji pod tym adresem:

- testowo.pinger.pl/m/3883816/2-pomoce-obramowania

Jednak co nie co przypomne...

A wiec za obramowanie odpowiada BORDER:

border-top -oznacza gorne obramowanie,
border-bottom -oznacza dolne obramowanie,
border-right -oznacza prawe obramowanie,
border-left -oznacza lewe obramowanie...

Oprocz tego rozrozniamy rodzaje obramowan:

none -oznacza brak obramowania,
dashed -oznacza obramowanie kreskowane,
dotted -oznacza obramowanie kropkowane,
solid -oznacza grube obramowanie,
double -oznacza podwojne obramowanie,
groove -oznacza obramowanie trojwymiarowe...

Czyli np. Wstawiajac kod:

border-right: none; -prawy blok nie bedzie mial obramowania,
border-left: dotted; -lewy bok bedzie mial obramowanie kropkowane...

W kodzie oprocz rodzaju obramowania,wazna jest rowniez jego wielkosc i kolor...

Jak wiemy kolor opisujemy przez COLOR zas wielkosc przez PX czyli pixele...

Przykladowy kod:

.sidebox {
border-right: red 2px dotted;
border-bottom: red 2px dotted;
border-top: none;
border-left: none;
}

Jak widzicie gorne i lewe obramowanie ma wartosc NONE-oznacza to ze tych obramowan nie bedzie widac.
Za to prawe i dolne bedzie w kolorze czerwonym,kropkowane i bedzie mialo wielkosc 2px...

Wielkosc kazdy ustawi sobie sam-wystarczy poeksperymentowac...

Napisze Wam jeszcze jeden przyklad a dokladnie-jezeli chcemy zeby obramowanie bylo na okolo bloku,czyli z 4 stron-mozemy to zrobic na dwa sposoby...

Przyklad 1.

.sidebox {
border-top: green 2px dotted;
border-right: green 2px dotted;
border-left: green 2px dotted;
border-bottom: green 2px dotted;
}

Przyklad 2.

.sidebox {
border: green 2px dotted;
}

Jak widzicie drugi przyklad jest o wiele szybszy do wpisania-a daje nam takie same obramowanie jak pierwszy...


...
ramki.png

Nie możesz dodać komentarza.
Tylko zalogowani użytkownicy mogą komentować ten wpis.